今日は、WordPressに手っ取り早くTwitterを表示させることができた覚え書きです。
＜ポイント＞
- Twitterの公式プロフィールウィジェットを使う
- そのコードを丸ごとサイドバーに貼り付けると簡単に表示させることができる。
１．今日までの経緯
先週、このサイトをTwitterに連動させる作業をしました。
上記ブログにこの経緯を書いていますが、私は結局、プラグインは使わずに、Twitterの公式ウィジェットを使ってサイドバーに直接コードを貼り付ける作業をしました。
２．確認作業
ところで、私はページによってサイドバー表示を変えていますが、それはサイドバーを複数作るのではなく、条件分岐で表示方法を変える手法を取っています。なので、コードの貼り付けは３カ所に行いました。
一方、私は、サイドバーについて、ソースは自分で作りつつ、一部にウィジェットの使用もできるように設定しています。
ですので、ウィジェットのテキストエリア機能を使ってそこにTwitterのコードを貼り付けてみたら動くのでは？と思ってやってみたらちゃんと動きました（知っている人には当たり前のことかも知れません）。
なので、私は３カ所にペーストしたコードを削除して、ウィジェットを使って表示させることにしました。
３．ウィジェットを使ってTwitterプロフィールを表示させる具体的な方法
１．Twitter公式ページのウィジェット欄を開く
２．左にある「自分のサイト」をクリックして、切り替わった画面の「プロフィールウィジェット」をクリック。
３．各種のセッティングをして、下の「Test Settings」で確認、問題なければ「Finish & Grab Code」をクリックしてコードを取得してそれを全部コピー。
４．マイWPサイトの「ウィジェット」画面に入り、「利用できるウィジェット」の中から「テキスト」を右へドラッグ。
５．ドラッグしたテキストタブを開いて、コピーしたコードを貼り付け。タイトルには何も記入しなければ表示されないし、記入すればそれがサイドバーのスタイルに従った形で表示される。
６．貼り付けてみてスタイルを調整したい場合は、貼り付けたテキストの「width」や「height」を直接編集すればよく、もう一度Twitterに入ってやる必要はない。
４．余白マージンの修正
ウィジェットを使って貼り付けるととても便利に表示できますが、ウィジェットの下が次のウィジェットを上部とくっついてしまうのではないかと思われます。簡単に下部のマージンを調整したい場合は、
<div style="margin-bottom:20px;"></div>
と貼り付けるとマージンを調整することができます（やり方がスマートかどうかは・・・です）。
もうしばらくTwitter関連で修正する必要はないでしょう。勉強になりました。