WEBサイトにツイッターのタイムラインを表示する

ブログ関連

こんにちは、ゆんつです。

ネットをを見ていると、たまに自身がツイッターでつぶやいた内容をサイドバーなどに表示しているサイトを見かけることがあります。

これはWEBサイトにツイッターのタイムラインを埋め込むことにより表示されるようになります。

ツイッターのタイムラインの埋め込み方法はとっても簡単。

今日はブログにツイッターのタイムラインを埋め込む方法と、僕が遭遇したツイッターの埋め込みが上手く表示されなかった場合の解決法について書きたいと思います。

タイムラインの埋め込み

まずタイムラインを表示したいツイッターのURLをコピーしておきます。

以下のサイトを開きます

Twitter Publish

タイムラインを表示したいツイッターのアドレスを入力して「→」をクリックするかEnterキーを押下

「Here are your display options」という画面になるので「Embedded Timeline」を選択。

するとタイムラインを表示するためのタグが表示されるので「Copy Code」をクリック

あとはコピーしたコードをタイムラインを表示させたい場所に貼り付ければいいだけです。

試しに、ここに貼り付けてみます。

こんな感じ。

タイムラインの見た目は自分の好きなようにCSSで調整すればいいだけです。

ゆんつ
ゆんつ

簡単

タイムラインが表示されなかったケース

このようにタイムラインのWEBサイトへの埋め込みはとても簡単だったのですが、僕はあるトラブルに見舞われました。

それは、きちんと埋め込んだはずのタイムラインが表示されないというトラブルです。

具体的にはタイムラインを埋め込んだ部分に自分のツイートが上から順に時系列で並ぶはずなのですが、ツイートは表示されず自分のツイッターへのリンクの表示になってしまいます。

ちなみにこの現象が起きたのはFirefox。

それ以外のChromeやEdge、IEではきちんとタイムラインが表示されます。

色々調べても解決法が無く途方に暮れFireFoxをいじくりまわしていたら犯人がわかりました。

こいつです。

これはFireFoxのGhoestryというアドオンです。

Ghosteryがどのような機能を持つかの説明は他のサイトにお願いするとして

トラッキング防止を見える化 - Firefox拡張機能「Ghostery」
Firefoxの拡張機能「Ghostery」は、Webサイトがどのようなトラッカーを設けているのかを可視化できるツール。自分の情報がどこへ流れていくのか知りたい人は、要チェックです。

Ghestryでツイッターのチェックを外すと

FireFoxでも無事タイムラインが表示されるようになりました。

というわけで、僕が遭遇したタイムラインが表示されない原因はFirefoxのアドオンのGhosteryが原因でした。

似たようなケースの方の参考になれば幸いです。

それでは、またー。

コメント