Twitterウィジェットで埋め込みタイムラインを作成する方法

こんにちわ。ライターのだるまさんです。
今回は、Twitterのタイムラインを自身のブログやWebサイトに表示する方法について、説明していきます。
5分もかからずに設定できてしまいますので、こちらの記事を参考にしながらぜひ設定してみてください。

 Twitterのタイムラインをサイトに埋め込む方法

まずは自身のTwitterにアクセスしましょう。

右上の赤枠で囲んだプロフィールアイコンをクリックして、

「設定」をクリック、

左側のメニューに表示される「ウィジェット」をクリック、

そして右上の表示される「新規作成」のボタンをクリックして、

メニューの一番上にある「プロフィール」をクリックします。
するとこのようなページが表示されます。

真ん中のボックスに、自身のTwitterのURLを入力して、右の矢印のボタンをクリックすると、
このように2つのオプション画面が表示されますので、
左の赤で囲んだ「Embedded Timeline」をクリックします。

すると上のように実際のタイムラインが表示されます。
タイムラインのサイズや色などを調整することも可能で、

こちらの赤枠で囲んだ「set customization options」をクリックすると、
このような画面が表示されます。上の赤枠で囲んだ場所で「幅」と「高さ」、真ん中の赤枠の箇所で「背景の色」と「リンクの色」が変更できます。
ちなみに緑にするとこのような感じになります。
言語の設定を変更したい時は、一番下のメニューの赤枠の箇所から変更できます。

通常Automaticに設定すれば日本語で表示されます。
設定の修正が完了したら右下の赤枠「Update」をクリックして、

赤枠で囲んだ「Copy Code」をクリックします。

このような画面が表示されたら完了です。
あとは、コピーしたコードを自身のサイトに貼り付けすれば設定完了です。

今回作成したタイムラインはこちらになります。

Tweets by INFACT_JP

ちなみに自分が運営しているTwitterアカウント以外のタイムラインも作成可能です。
やり方は同じで、こちらの検索ボックスにURLを入力して設定していくと作成できます。

Tweets by TomoyasuOhmi

Tweets by tenkijp

ちなみに上では、プロフィールのタイムラインを作成する方法を説明しましたが他にも

「いいね！」「リスト」「コレクション」「検索」のウィジェットも作成可能とされています。
ただし「いいね！」「リスト」「コレクション」に関しては、上で解説したタイムラインと同じものが作成される仕様になっています。

ちなみに「検索」のタイムラインを作成する方法ですが、上のリストから「検索」のボタンを押すと
下のようなページが表示されます。

左の赤枠で囲んだ箇所にタグを入力すると、
そのタグについて言及したTweetをタイムライン形式で表示してくれます。
（上の画像では「＃corgi」になっています。）

例えば「＃Infact」と入力すると、
このようにプレビューの表示も変化しますので、
確認して問題なければ下の赤枠のコードをコピーして、サイトに貼り付ければ完成です。

まとめ

いかがでしたか？
Twitterの埋め込みタイムラインは、フォロワーを増やす一つの方法として、とても有効な施策です。
簡単に設定できてしまいますので、まだ設定していない方は早速やってみましょう！