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

WordPressにTwitterのタイムラインやツイートを埋め込む方法をまとめておきます。

WordPressにタイムラインやツイートを埋め込みたい時は、URLを直接入力する方法が一番簡単です。カスタマイズが必要であれば、Twitter Publishでコードを取得する方法を検討してみて下さい。

アカウントURLとツイートURLの確認

WordPressにURLでTwitterを埋め込む時は、「アカウントURL」及び「ツイートURL」が必要になります。

	URL
タイムライン（アカウントURL）	https://twitter.com/ユーザー名
特定のツイート（ツイートURL）	https://twitter.com/ユーザー名/status/数字

アカウントURLは、プロフィール画面を表示すると確認できます。

ツイートURLは、特定のツイートをクリックすると確認できます。

Twitterを埋め込みたい時は、URLの取得方法だけ覚えて下さい。

段落ブロック及びTwitterブロックにURLを入力する

記事編集画面の段落ブロックにコピーした「アカウントURL」及び「ツイートURL」をそのまま貼り付けます。

タイムラインや特定のツイートが挿入されたら埋め込み完了です。

記事にTwitterを埋め込みたい時に使える一番シンプルな方法です。

TwitterブロックにURLを入力しても同じですが、ブロックを選択する手間が増えるだけなので、個人的には段落ブロックに直接URLを入力する方法がおすすめです。

Twitter Publishでコードを取得する方法

この方法は、デザインを変更したり、リンクをボタンにしたり、リプライの元ツイートを表示させたくない等、カスタマイズできるのが特徴ですが、Twitter Publishで専用コードを取得する必要があります。

Twitter Publishにアクセスして、（画面下部にスクロールして）取得したいオプションを選択して下さい。

ツイート

特定のツイートを埋め込みたい時は、「Embedded Tweet」を選択して「ツイートURL」を入力します。

表示されたコードをコピーします。

この際、「set customization options」をクリックすると、カスタマイズオプションが表示されます。

設定	詳細
How would you like this to look?	テーマのカラーをライトとダークから選択できる
What language would you like to display this in?	表示する言語を選択できる（初期設定は自動）
Hide Conversation	元ツイートを表示しない（リプライ埋め込み時）
Opt-out of tailoring Twitter	ユーザ行動データをTwitterに送信しない

記事編集画面で「カスタムHTML」ブロックを追加して、コピーしたコードを貼り付けて設定完了です。

プレビューでツイートが埋め込まれていることを確認して下さい。

タイムライン

タイムラインを埋め込みたい時は、「Embedded Timeline」を選択して「アカウントURL」を入力します。

表示されたコードをコピーします。

この際、「set customization options」をクリックすると、カスタマイズオプションが表示されます。

設定	詳細
What size would you like your timeline to be?	高さと幅をpx単位で指定できる
How would you like this to look?	テーマのカラーをライトとダークから選択できる
What language would you like to display this in?	表示する言語を選択できる（初期設定は自動）
Opt-out of tailoring Twitter	ユーザ行動データをTwitterに送信しない

記事編集画面で「カスタムHTML」ブロックを追加して、コピーしたコードを貼り付けて設定完了です。

プレビューでタイムラインが埋め込まれていることを確認して下さい。

ボタン

ボタンを設置したい時は、「Twitter Buttons」を選択してボタンの種類と必要な情報を入力します。

ボタンによって役割が異なるので、必要なものを選んで下さい。

記事編集画面で「カスタムHTML」ブロックを追加して、コピーしたコードを貼り付けて設定完了です。

プレビューでツイートボタンが埋め込まれていることを確認して下さい。

ウィジェットに埋め込む

ウィジェットにTwitterを埋め込みたい時は、表示させたい場所に「カスタムHTML」ウィジェットを配置して、タイムラインなら「アカウントURL」、ツイートなら「ツイートURL」を入力します。

幅や高さ等のカスタマイズが必要であれば、Twitter Publishで取得したコードを入力して下さい。

最後に

WordPressにTwitterを埋め込みたい時は、「アカウントURL」及び「ツイートURL」を入力する方法が一番簡単です。記事だけでなく、ウィジェットにもそのまま配置できるのでおすすめです。

但し、URLで埋め込む方法はカスタマイズすることができません。カラーを変更したり、横幅や高さを変更したい時は、Twitter Publishでコードを取得して「カスタムHTML」ブロックに貼り付ける方法を使って下さい。