継続的にブログに訪れてくれるユーザーさんを増やすために、twitterのタイムラインとフォローボタンをサイドバーに設置しました。
ブログを運営するにあたって、twitterなどのSNS拡散はバカにできないので、是非この記事を参考にしてtwitterウィジェットを設置してみてください。
こんな風にサイドバー以外にも使用できるので、使いどころ次第では結構便利ですよ！
よろしかったらついでにフォローもお願いします。
こんな感じのウィジェットになります。
作成したフォローボタンとタイムライン
twitterのフォローボタン作成手順
まず、自分のtwitterのページにログインします。
その後、「設定」→「ウィジェット」→「新規作成」→「コレクション」
でtwitterのウィジェット作成ページに飛びます。
twitterの設定画面
下のような画面に飛びます。
twitterのウィジェット作成ページ
上のページの「Enter a Twitter URL」のスペースに、自分のツイッターページのURLを入力します。
URLのここの部分です。
自分のtwitterページのここの部分を入力します。
すると、タイムラインを作成するか、フォローボタンを作成するかを選ぶ画面が出てくるので、
フォローボタンの場合は、「Twitter Buttons」を選びます。
作成ウィジェット選択画面
これだけで、基本のボタン作成用のコードは出来てしまいます。
ボタンをカスタマイズしたい場合は「set customization options」をクリックします。
twitterフォローボタンのコード。カスタマイズもできます。
フォローボタンのカスタマイズ画面です。
「Hide Username」でボタンにユーザー名を表示するか、
「Large Button」でボタンを拡大するか、
ボタンの言語 が選択できます。
twitterボタンカスタマイズ画面
「Update」をクリックすると、上記で選択した設定が反映されたtwitterボタンのコードが取得できます。
あとは、このコードをコピーして、Twitterボタンを表示したい場所に貼りつけれるだけでオーケーです。
twitterのタイムラインの作成方法
タイムラインもほとんどフォローボタンと同じ手順で作成できます。
上記の作成ウィジェット選択画面でタイムラインを選択します。
twitterウィジェット選択ページ
タイムラインの作成ページに飛んだら、フォローボタンの場合と同様に、「set customization options」でカスタマイズ画面に飛びます。
「Height」でタイムラインの全長が選択できますが、あまり長すぎるとスマートフォンで表示した際にタイムラインが邪魔になり操作性が悪化するため、400px程度がおすすめです。
twitterタイムラインウィジェットカスタマイズ画面
「Update」をクリックすると、上記で選択した設定が反映されたtwitterタイムラインのコードが取得できます。
フォローボタン・タイムラインをサイドバーに設置
上記手順で取得したコードをサイドバーウィジェットのスペースに貼りつけていきます。
WordPressの「外観」→「ウィジェット」で、テキストをサイドバーウィジェットのスペースにドラッグし、テキスト欄に先ほどのコードを貼りつけます。
WordPressのウィジェット画面。テキストをサイドバースペースにドラッグしてコードを貼りつけます。
これで、サイドバーにtwitterのフォローボタンとタイムラインを設置できます。
まとめ
WordPressのサイドバーにtwitterのフォローボタンとタイムラインを設置する手順を紹介しました。
結構な労力をかけて記事を作成しているので、SNSをうまく使って多くの人の目に触れるようにしていきたいものです。
この記事が少しでも役に立ちましたら、シェアやはてなブをお願いします。励みになります。