こんにちは。龍馬(@Ryoma_Anabuki)です。
新米ブロガーにとって、Twitterとの連携は「生命線」とも言えるほど、大変重要ですよね。
ブログを始めたばかりの頃は、誰も自分のブログに来てくれません。。。
アクセス数とか、ホント見ちゃダメですよね（笑）
そんな状態でも、Twitterで「新記事を投稿しましたよ〜！」と発信することで、少しずつアクセスを伸ばしていけるのが唯一の救いです。
ということで、本日は「TwittterとWordpressブログの関連付けに」ついて、わかりやすく説明していきます。
Twitterのタイムラインや投稿記事をブログに埋め込む 3つの方法
Twitterの埋め込みタイプは、大別すると下記の3パターンです。
- Twitterのタイムラインをブログの記事に掲載する方法
- Twitterのタイムラインをウィジェットとして、サイドバーに掲載する方法
- Twitterの特定の投稿記事を、ブログの記事に埋め込む（引用する）方法
Twitterのタイムラインをブログの記事に掲載する方法
Twitterのタイムラインとは下記のようなものです。（私のTwitterを埋め込みました。）
いかがでしょうか？ 上下にスクロールすると、最新→過去の投稿記事を見られますよね？
ぶっちゃけ、この方法が最も簡単です（笑）
＜具体的な設定方法＞
①まずChromeやSafariなどのブラウザーで「Twitter」にログインし、「プロフィール」を選択します。
②ブラウザーに表示された「URL」をコピーします。
「https://twitter.com/XXXXXXXXX ←ここにあたなの「アカウント名」が表示されているはずです。
③その後、WordPressの記事の中に、②でコピーしたURLを貼り付けるだけです。
※「ビジュアル」で見ると、下記のようにURLが貼られているだけのように見えますが、「プレビュー」してもらえれば、「URL → タイムライン」に変換されていることがわかると思います。
・Twitter プロフィールのURLをコピペするだけ！
・常に最新記事が表示されてしまため、ブログの記事には埋め込みずらい
Twitterのタイムラインをウィジェットとして、サイドバーに掲載する方法
この方法は、以前、当ブログで紹介した「アフィリエイト広告をウィジェットとしてサイドバーに掲載する方法」にとても似ています。
もし詳しい手順を知りたい人は、下記の記事を参考にしてください。
＜具体的な設定方法＞
①まずChromeやSafariなどのブラウザーで「Twitter」にログインし、「プロフィール」を選択します。
②ブラウザーに表示された「URL」をコピーします。
③ウィジェット用にちょっと加工する必要があるので、Twitter公式ツールに飛びます。
上図のようにTwitterのURLを貼り付け、「→」を押します。
表示オプションを尋ねられますので「Embedeed Timeline（埋め込み形式のタイムライン）」を選択してください。
このままだと、すっごく縦長で使いづらいウィジェットになってしまうので「set customization option」を押してください。
いろいろ試しましたが、Height(px)を500、Width(px)を600に設定するのがオススメです。（あとで変更できます）
また日本語のブログに埋め込む場合は、Japanese（日本語）を選択しましょう。
「Update」→「Copy Code」と進んでください。
うまく変換できていれば、下記のような画面がポップアップします。
④それではWordpressに戻りましょう。
「外観」→「ウィジェット」に進み、「カスタムHTML」を選択します。
ウィジェットを表示したい場所（サイドバー、等）を選んで「ウィジェットを追加」しましょう。
「タイトル」を決めたら、「内容」の部分に、③でコピーしたURLを貼り付けて完成です。
Twitterの特定の投稿記事を、ブログの記事に埋め込む（引用する）方法
それでは最後の埋め込み方法をご紹介します。
実際、ブログを書く際は、この方法が最も使われかもしれませんね。
＜具体的な設定方法＞
まず埋め込みたいTwitterの記事の右上「ｖ」をクリックします。
すると、下記のような選択肢が現れますので、「</>ツイートを埋め込む」を選択します。
そうすると、勝手にこんな画面に飛びます。
「Copy Code」を押しましょう。
うまく変換できていれば、下記のような画面がポップアップします。
その後は、WordPress ブログの記事に先ほどのURLをコピペするのですが、
「ビジュアル」ではなく「テキスト（HTML）」を選択してから、コピペしてください。
こんな感じです。（ は改行です。この間にコピペしましょう）
その後、「ビジュアル」に戻ると下記のような見え方をしますので、ちょっと驚くかもしれません。
でもこれで問題ないです。
▼下記が実際の記事（みなさんが見ているTwitterの投稿記事）になります。
／
【完全無料】高解像度 ヘッダー画像の作り方
＼▼下記で悩んでいる人向け
・フリーソフトでボケボケの画像しか作れなかった人
・有料のイラストソフトを購入したくない人▼この記事で解決！
・高画質 ヘッダー画像をすぐに作成可能https://t.co/OF7KUvygOT#ブログ初心者 #ブログ仲間募集中— 龍馬@ブロガー (@Ryoma_Anabuki) April 27, 2020
まとめ
今回はTwitterをWordpressブログに掲載するための3つの方法をご紹介しました。
- Twitterのタイムラインをブログの記事に掲載する方法
- Twitterのタイムラインをウィジェットとして、サイドバーに掲載する方法
- Twitterの特定の投稿記事を、ブログの記事に埋め込む（引用する）方法
是非、Twitterとブログを関連付けて、アクセス数を伸ばしてくださいね！
※逆に、ブログ記事をTwitterに投稿したい方は、下記の記事を参考にしてみてください。
