WordPressやbloggerで使えるTwitterウィジェットを簡単に追加する方法

今回は、WordPressやbloggerで簡単に使える「Twitterウィジェットの使い方」をシェアしようかなと。

Twitterで作れるウィジェットが新しくなり、若干分かりにくくなっていたので、補足する感じでご紹介します。

ウィジェットの作成はTwitterから

▲Twitterに移動し、プロフィールから「設定とプライバシー」を開きます。

Twitterのタイムラインをブログやホームページに配置したい場合、まずはTwitterへ移動しましょう。ウィジェットの設定はそっちでやります。

▲「ウィジェット」から「新規作成」を選択し、「プロフィール」をクリック。
▲自分のTwitterの「URL」を入力し、「→」をクリック。コピペすればOK。
▲こんな感じの画面が出るので、「Embedded Timeline」を選択。
▲ここでコードをコピーして貼り付けてもOKですが、もうちょっと設定しておきましょう。

ここで出たコードをそのまま貼り付けてもウィジェットは作れるのですが、それだとサイズの指定とかできないので、「set customization options」をクリックして細かい設定をやっておきます。

細かい設定と言っても変えるのは2カ所だけ

▲ここでは「Height」と「Width」を変えればOK。

細かい設定と言っても変更するのはほんのちょっとで、「Height(高さ)」と「Width(幅)」を好きな数値に変えておきます。

だいたい250~300くらいでほとんどの人が綺麗に収まるはず。

テーマカラーは「Light」「Dark」の2種類あるので、ついでに選んでおくと良い感じ。あとはそのままでOKです。

▲設定が終わって「Update」をクリックすれば完了!

WordPress/bloggerでウィジェットを作る

▲後は、Twitterで作ったウィジェットのコードを貼り付けるだけ。

WordPressに貼り付ける場合は「ウィジェット」から。「テキスト」を選択して、先ほどコピーしたコードを貼り付ければ完了です。環境は人それぞれなので細かい所は割愛。

▲「width」「height」の数値を変更すればウィジェットサイズを変えられる。

bloggerの場合、ウィジェットの作成は「レイアウト」から。「ガジェットを追加 → HTML/JavaScript」で先ほどコピーしたコードを貼り付けます。

WordPressでもbloggerでもコード内に記述されている「width」「height」の数値を変更すればウィジェットのサイズを調整できるので、サイドバーからはみ出したりする場合は上手く調整してみましょう。

きっとピッタリ収まるサイズがあるはずです。参考になれば。

Posted by iyusuke