WordPress に Twitter のタイムラインを埋め込む

WordPress のサイドバーに Twitter のタイムラインが埋め込まれているサイトをよく見るのですが、私も真似してみることにしました。
やり方をメモしておきます。

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

Twitter 埋め込み用コードを生成

Twitter 公式の以下のサイトにアクセスします。

Twitter Publish

publish.twitter.com

ページの真ん中にあるテキストボックスに、Twitter アカウントの URL を入力してエンターキーを押します。
Twitter アカウントの URL は「https://twitter.com/アカウント名」です。

Embedded Timeline か Twitter Buttons の選択肢が表示されますので、「Embedded Timeline」をクリックします。

そうすると、HTML コードが生成されますので、「copy code」ボタンをクリックしてコピーします。

<a class="twitter-timeline" href="https://twitter.com/PommeTech?ref_src=twsrc%5Etfw">Tweets by PommeTech</a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

ただ、このままだと、Wordpress に埋め込んだときにものすごく縦長で表示されてしまいます。
a タグのところに「data-height=”300″」とすると、縦300ピクセルで表示されますのでいい感じになるよう調整してください。

<a class="twitter-timeline" data-height="300" href="https://twitter.com/PommeTech?ref_src=twsrc%5Etfw">Tweets by PommeTech</a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

WordPress に埋め込む

WordPress の管理画面から、「外観」→「ウィジェット」を開きます。

「カスタムHTML」のウィジェットをサイドバーのいいところに設置して、先に生成したコードをコピペします。
ウィジェットのタイトルは、何も書かなくても大丈夫です。