ワードプレスのサイドバーにツイッターを表示させる方法

ワードプレスのサイドバーにツイッターのタイムラインを表示させているブログ、よく見ますよね? あれ!自分のブログにも実装させたいって思っている方に向けた記事です。 画像付きで詳しく説明しています。 参考にしてみて下さいね^^

スポンサーリンク

ワードプレスのサイドバーにツイッターのタイムラインを表示させる手順

ワードプレスのサイドバーにいろいろ表示させるには、まずウィジェット...なのですが、ウィジェットを開いたら完全に仕様が変わってて訳が分からない事になっている方いませんか^^;?

以下の記事でウィジェット表示を以前の仕様に戻す方法について書いているので、まずはそちらを見ながらウィジェットを旧表示に戻しておいて下さいね。

ワードプレスのウィジェットが表示されない!戻す方法はこれ!
ワードプレスのウィジェットの表示が以前の仕様と変わってしまって表示されない!とお困りの方、以前の仕様に戻す方法をまとめておきます。 参考にして下さいね^^

自分のツイッターアドレスを確認

ツイッターアドレスは、以下の「 ユーザー名 」 のところに、@以下の英数字を付け足したものになります。

https://twitter.com/ユーザー名( @なし )

ユーザー名は、ツイッターのプロフィール画面でも確認出来ます。

埋め込みたいタイムラインのリンクを取得する

埋め込みたいタイムラインのリンクは、下の 【 Twitter Publish 】 というサイトで簡単に取得する事が出来ます。

Twitter Publish

タイムライン表示をカスタマイズする

「 何を埋め込みたいですか? 」のところに、自分のツイッターアドレスを入力( コピペ )して下さい。

「 埋め込まれたタイムライン( 左側 )」を選択する。

「 カスタマイズオプションを設定する 」をクリックする。

「 タイムラインをどのサイズにしますか? 」

自分好みに設定可能です。 ちなみに私は、高さ( 400px )/ 幅( 350px )で設定しています。 実際にサイドバーに設置してみてから調整してみてもいいでしょう。

「 これをどのように見せたいですか? 」

背景の選択です。【 光 】を選ぶと白背景、【暗い 】を選ぶと黒背景になります。

「 これをどの言語で表示しますか? 」

言語を選択します。 「 自動 」のままでも問題はありません。 入力が終わったら「 アップデート 」 をクリックして確定。

アップデートするとコードが生成されるので、「 コードをコピーする 」をクリックします。

ウィジェットのサイドバーに設定する

ダッシュボード > 外観 > ウィジェット 

ウィジェット( サイドバー )に「 テキスト 」 を追加します。

テキストにコードをコピーする

「 タイトル 」

ツイッター や Twitter など、自分のお好みで^^

「 テキスト 」

ビジュアル ではなくテキストの方に、先程コピーしたコードを貼り付けて「 保存 」 をクリックしたら完成です。

サイトを表示させて、実際にツイッターのタイムラインがちゃんと表示されているか確認してみて下さいね^^

まとめ

私自身、複数のブログを運営しているのですが、サイドバーにツイッターのタイムラインを表示させたのは初めてで、本当にちゃんと表示されてるのを見て、ちょっと感動しちゃいました^^ サイトが更新されていなくてもタイムラインは更新されていくから、なんだかサイトが生きてるって感じがして良い!!

コメント

タイトルとURLをコピーしました