【Cocoon】サイドバーにTwitterのタイムライン挿入【WordPress】

ブログのサイドバーにTwitterのタイムラインを挿入されている方がいらっしゃるのを見て、是非、自分のブログでも挿入しようということにしました。

Twitterでブログの内容をアップしたりもしたり、記事にするまでもないような事をつぶやいたりしているので、ブログの追加コンテンツとしてもいいと思いました。

Twitterのタイムラインをブログのサイドバーに入れる為に、プラグインは必要ではありません。やり方さえわかれば、5分程で完了できると思います。

では、説明いたします。

Twitter 側の作業

Twitter Publishにアクセス

https://publish.twitter.com/

このサイトで、タイムラインに必要なコードを取得することになります。

Twitterのアドレスを入力して下さい。

トップ画面の所に、自身のTwitterアドレスを入力してください。

『https://twitter.com/ツイッターアカウント』がTwitterのアドレスになります。ツイッターアカウントは下記のようになります。

私の場合は”https://twitter.com/3tGQSG828qcu7Sn“という風になります。

オプションの選択

表示をどのようにするかの選択をすることになります。右側の『Embedded Timeline』を選んで下さい。そうするとコードが表示されます。

コードの編集

このコードのままですと、ブログにタイムラインが永遠と表示されてしまいます。高さ調整をすることで、表示の制限をすることが出来ます。コード右上の『set customization options』を選んで下さい。

高さの調整は『What size would you like your timeline to be?』の右側の『height』になります。上記の場合は”400“にしています。あとで簡単に変更できます。高さを入力すれば、『Update』をクリックして下さい。

そうするとコードが変更されるので、『Copy Code』をクリックして下さい。

WordPress側の編集

コードの入力

WordPressの『ダッシュボード』の『外観』の『ウィジット』をクリックして下さい。その中に『カスタムHTML』をクリックして下さい。

『サイドバー』を選択して、『ウィジットを追加』をクリックして下さい

右側の『サイドバー』のメニューに『カスタムHTML』が追加されます。名前を『Twitter』とし、内容の中に先ほどのコードを貼り付けをして下さい。

高さの調整

先ほどのコードの中に『data-height』 という項目があります。先ほど、Twitter Publishで400とした値が、入っています。実際のページで、この数値を調整して下さい。私の場合は300にしました。

まとめ

Twitterのタイムラインを入れることによって、閲覧者の方にTwitterを使っていることを知らせる事もできますし、Twitterでフォロワーになってくれるかもしれません。

ブログの記事を更新できていなくても、Twitterが更新されていれば、ブログ全体を新鮮に保つことが出来ると思います。

私のWordPressのテーマはCocoonになりますので、他のテーマの場合は若干異なるかもしれませんのでご了承願います。