Twitterのタイムラインをサイドバーに表示する方法

今回はツイッターとの連携という事でサイトやブログのサイドバーにタイムラインを表示する方法を紹介していきます。

もちろんこのブログで紹介しているアメブロでもシーサーブログでもWordPressでも表示させる事ができるので、それぞれのやり方も解説してみます。

ツイッターとの連携で集客効果やフォロワーを増やせる可能性もありますし、設置も簡単です。必要なのはツイッターのアカウントだけ。ちなみに色は「明るい」のと「暗い」の２種類から選ぶ事ができます。

これの設置方法を紹介していきます。

ツイッター設置の手順

ツイッターのタイムラインをサイドバーに表示するためにツイッターにログインしておきます。ログインしたら右上の歯車のマークをクリックして「設定」をクリック。

クリックしたら左のサイドバーに「ウィジェット」という項目があるのでクリック。

ここで「ウィジェット」の「新規作成」をクリックします。

次の画面で各種設定ができます。

画像を表示するかどうかや高さ、それから最初の画像で紹介したように「明るい」と「暗い」の２種類のテーマが選択できます。任意で変更をして「ウィジェット」を作成をクリックすると下にコードが表示されます。

このコードをサイドバーに貼り付ければ完成です。

Seesaaブログの場合

シーサーブログの管理画面から「デザイン」⇒「コンテンツ」と進み、「自由形式」をサイドバーに追加してこのコードを追加。

また、ブログで表示を確認してみて上や下のコンテンツとの余白が欲しい（詰まっている）場合はツイッターのコードの前後に改行タグ<br />を追加する事で上や下に余白を作る事もできます。

それから自由形式にタイトルを付けて表示したい場合、例えば「ツイッターのタイムライン」とかタイトルを表示したい場合はこの記事を参考にして下さい。
⇒Seesaaブログの自由形式のタイトルを表示させる方法

アメブロに追加する場合

アメブロに追加する場合は「マイページ」右上の設定マークをクリックして「プラグインの追加」をクリック。

プラグインの追加というページになるので「フリープラグイン」をクリックして取得したコードを追加して保存。

「新たにプラグインの追加をした方→サイドバーに配置してください。設定はこちら」という表示がでるので「こちら」という部分のリンクをクリックします。

それでコードを追加したフリープラグインをサイドバーの好きな位置に移動させれば完了です。

また、アメブロの場合もブログで表示を確認してみて上や下のコンテンツとの余白が欲しい（詰まっている）場合はツイッターのコードの前後に改行タグ<br />を追加する事で上や下に余白を作る事もできます。

WordPressに追加する場合

WordPressの場合は管理画面から「外観」⇒「ウィジェット」と進みます。

サイドバーに「テキスト」を追加してテキスト内にコードを追加して「保存」すればOK。

WordPressの場合もブログで表示を確認してみて上や下のコンテンツとの余白が欲しい（詰まっている）場合はツイッターのコードの前後に改行タグ<br />を追加する事で上や下に余白を作る事もできます。

以上ブログのサイドバーにツイッターのタイムラインを表示する方法です。他にも任意のツイートを記事内で紹介する方法もあるので紹介しておきます。

• ⇒記事内にTwitterのツイートを埋め込む方法