【5分でできる!】Twitterのタイムラインをサイドバーに埋め込んでみました。【Cocoon】

Cocoon
この記事は約3分で読めます。


Twitterのタイムラインが埋め込まれているブログを見かけたので「これどうやるん?」と思い、いろいろと調べてみました。

twitter timeline
Twitterの規制がわからないのでモザイクかけています。

〜こんな感じです〜



プラグインを入れる必要もなく、5分ぐらいで設定できるので自分のブログに取り入れてみてください。



naka
naka

コードの知識がほぼない僕でもできたので大丈夫です!

Twitter Publishからコードをコピー

https://publish.twitter.com/

まず、このサイトに入り自分のTwitterのアドレスを入れます。

引用 Twitter Publish


Twitterのアドレスは

https://twitter.com/(Twitterアカウント)

です。


Twitterのスクショは著作権的にアウトみたいなので画像を載せることはできませんが、

ぼくのTwitterの場合は(@naka_twilog)なので、https://twitter.com/naka_twilogが正解です。

次にこんなのが出てくると思います。

引用 Twitter Publish

左の「Embedded Timeline」を選択してみてください。

そうすると、HTMLコードが出てきます。

引用 Twitter Publish

このままのコードだとサイドバーのタイムラインがブログの下まで長く表示されてしまうので、高さを設定しましょう。



赤線で囲っている「set customization options」から高さを設定できます。

引用 Twitter Publish

heightの欄に好きな長さの値を入れましょう。(後からでも変えられます。)
サイトによって変わりますが、300〜600がおすすめです。

カスタムHTMLにペースト

WordPressの管理画面から「外観」→「ウィジェット」と開きます。

WordPress


サイドバーに「カスタムHTML」の項目を追加し、
タイトルをTwitter、〇〇のツイートなど適当に設定したら、さっきのコードをペーストしてください。

WordPress

date-heightの後の数字をいじったら高さの変更ができると思います。

設定完了!!

自分のブログを開いて埋め込めていたらOKです。

前に書いた記事。一部にモザイクかけてます。



ブログからTwitterへのアクセスが増えたり、記事を書いている人の発信をリアルタイムで見れたりするのでブログの信頼性が向上するなどいろいろ効果はあるみたいです。


直接SEOに関係はしませんが、少しブログに華を持たせるという意味合いで設定してみるのもおもしろいと思います。




サイドバーにTwitterのタイムラインを埋め込む方法について書きました。
少しでも参考にしていただけたら嬉しいです。

最後まで読んでいただき、ありがとうございました!

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