個人での利用はもちろん最近では企業のマーケティングに欠かせなくなったSNSプラットフォームの一つであるTwitterは、新たな情報をタイムリーに共有するのに最適なSNSです。そしてWordPress（ワードプレス）で作ったウェブサイトをお持ちの場合は、Twitterの投稿を簡単に埋め込んで表示することができ、サイト上でもより多くの人に見せることが可能です。
今回は、WordPressウェブサイトにTwitterの投稿ウィジェットを埋め込む方法、Twitterとウェブを連携させることのメリットについて解説します。さらにSNS✕WEB制作ツール『EmbedSocial』のフィード機能を使って、自分のアカウントの投稿や、ハッシュタグで集めた投稿をウェブサイトに表示する方法もご紹介した、広範なガイドとなっていますので、ぜひお役立てください。
どのようなウェブサイトか、どのような機能を使いたいかによって、いくつかの方法があります。
１）EmbedSocialのようなTwitter埋め込みツールの利用（自動オプション）
２）WordPressフィードプラグインの利用（基本オプション）
３）Instagram埋め込みコードの利用（手動オプション）
WordPressには様々な機能を追加するためのプラグインが用意されています。私たちEmbedSosialでもプラグインを提供していますが、私たちの経験では、ユーザーのほとんどは、Twitterプラットフォームからのコードを貼り付けるためだけに、さらに別のプラグインを導入する必要はありません。EmbedSocialのフィード機能は、プラグインなしでTwitterの投稿を埋め込みたいユーザー向けに設計されています。
また、これらのツールはWordPress以外で使用することができ、ユーザーはTwitterの投稿で好きなウィジェットを作成することができます。この方法については、後述するセクションで詳しくご紹介していますので、そちらをご覧ください。
WordPressを使用している場合、Custom Twitter FeedsなどのTwitterのWordPressプラグインを使用して、Twitter投稿を埋め込むことができます。これらのプラグインは、みなさんのウェブサイトのサイドバーや他のウィジェットエリアに簡単にTwitterの投稿を埋め込むことができます。
プラグインもその他のツールも使いたくない場合は、Twitterの埋め込みコードを使用して投稿を埋め込むことができます。埋め込みたいツイートの右上にあるプルダウンマークをクリックして、「ツイートを埋め込む」をクリックします。※この作業をする場合は、パソコンでツイッターを開いてください。スマートフォンには対応していません。
備考：この方法では、個別の投稿のコードを一つずつコピーして貼り付けていく必要があります。例えば5つ以上の投稿を埋め込む必要がある場合、この方法はお勧めできません。1つのコードで複数の投稿を埋め込むには、やはりTwitter投稿を埋め込むためのツールやプラグインを使ったほうがよいでしょう。
Twitter投稿を埋め込むための他の方法として、ショートコードを利用することもできます。Twitter投稿のショートコードを生成し、フィードの管理・カスタマイズを外部のプラットフォームで行うプラグインがいくつかあります。
これらの特徴は、ショートコードの埋め込みのみを可能にするプラグインであり、定期的なメンテナンスが不要なシンプルで軽いプラグインであることです。更新はすべて外部のプラットフォームで行い、そこでウィジェットを作成し、ショートコードを取得することができます。
基本的にこれらのプラグインは、JavaScriptのコードを丸ごと貼り付けずに簡単な埋め込み方法のショートコードを利用したい場合にのみ有用です。例えば、私たちの製品EmbedSocialではショートコードを生成でき、さらにプラグインを使ってショートコードを埋め込むことが出来ます。
ここでは、EmbedSocialプラットフォームのフィード機能を使ってTwitterをWordPressサイトに埋め込む方法をご紹介します。
なおEmbedSocialプラットフォームのご利用にはお申し込みが必要です。ご興味のある方はお問い合わせページへ、ご利用をご希望の場合はお申し込みページからご連絡ください。
EmbedScialはTwitter APIと直接統合されているので、ユーザーIDの設定やアクセストークンなどの難しい設定は必要ありません。利用開始にはEmbedSocialとTwitterのアカウントの接続が必要ですが、ユーザーの皆様はガイドに従って画面をクリックし、WordPressで作成したウェブサイトでTwitter投稿を埋め込み・同期するための許可をEmbedSocialに与えるだけでOKです。
また、EmbedSocialでは、WordPressの投稿に直接埋め込むためのコードを、javascriptコードとTwitterの投稿をショートコードで埋め込むためのプラグイン、の2つのオプションを提供しています。どの方法を選択するかはみなさん次第で自由に選べます。以下に両方のケースについてご説明します。
EmbedSocialフィード機能を通してTwitterからの投稿収集を希望される場合には、Twitterアカウントをシステムへと接続することが必要となります。接続するアカウントと収集する投稿の関連は必要なく、いずれかのアカウントを接続することでTwitter投稿の収集が可能となります。
表示されるポップアップに従い、TwitterでEmbedSocialのアクセスを許可します。
無事にEmbedSocialプラットフォームとTwitter アカウントの接続が完了すると、投稿が収集できるようになります。EmbedSosialではTwitterの3つの種類の投稿を収集するか選択できます。
以下のように、投稿を取得したいTwitterアカウントを選択すれば、ソースタイプの選択は完了です。
EmbedSocialのフィード機能では、たくさんのレイアウトがあるため、様々な見せ方でTwitter投稿をウェブサイトに表示することが出来ます。例えば、Twitterの投稿をスライダー形式で表示することも可能です。希望のレイアウトを選択して「フィードの作成」ボタンをクリックするだけで、ウェブサイトに埋め込むためのコードを表示する画面に移動します。
左枠のコードを埋め込むことで、Twitterから収集した投稿をWEBサイト上で表示させることができます。
EmbedSocialのフィード機能では編集画面内の「モデレーション」ページで、ウェブサイト上で表示するTwitterの投稿を選択することができます。また「並べ替え」ページでは、投稿のピン留めや表示順を設定することが出来ます。その他さまざまな編集が可能です。
最後にEmbedSocialで生成されたTwitter投稿をウェブサイトで表示するためのコードをコピー＆ペーストします。このステップでは、JavaScriptコードとショートコードの2つのコードを使用することができます。以下では、両方の方法を説明します。
ウィジェットのコードを取得するには、設定パネルの左上セクションにある「コードをコピー」をクリックするだけです。コピーされるのは、WordPressのページや投稿に埋め込むことができるJavaScriptコードです。
次に、WordPressアカウントにログインしてWordPress管理エリアに入り、「投稿」または「ページ」から、ウィジェットを表示したいページまたは投稿を探します。次に、以下の手順を実行します。
備考: WordPressクラシック版のエディタを使用する場合、「ビジュアル」から「テキスト」に切り替えるだけでよいでしょう。
前述のとおり、EmbedSocialフィード機能 には、JavaScript コードの簡易版として使用できるショートコードがあります。
このコードを見つけるには、以下のステップを踏むだけです。
以上で、Twitter投稿がウェブサイトに表示されるようになります。
Twitterのハッシュタグ付き投稿を埋め込みたい場合も、EmbedSocialのフィード機能を利用することで実現できます。EmbedSocialのフィード機能は、Twitterのハッシュタグを含む、あらゆる種類のSNS投稿をコンテンツをWordPressページに簡単に埋め込むことができます。
EmbedSocialプラットフォームにログインし、フィード機能を選択したら、以下の手順で進むだけです。
設定はこれだけで完了できます。一度設定をすればEmbedSocialプラットフォームが、指定されたハッシュタグを含むすべての最新投稿を自動的に取得・同期を行います。そのためウェブサイト上には常に最新の投稿が表示できます。さらに、上述の通り、投稿の表示・非表示の選択や、並べ替えも可能です。
EmbedSocialフィード機能には、管理している複数のTwitterアカウントから投稿を取得し、すべての投稿を統合したTwitterフィードを作成するオプションがあります。
例えば以下のような利用シーンで、複数のTwitterアカウントからTwitter投稿を作成するメリットを感じることが出来るでしょう。
利用シーンは無限大で、複数のアカウントのTwitter投稿をWordPressに埋め込む方法は、上述の手順と同じです。
Twitterの投稿をWordPressのウェブサイトで見栄えよく表示するために、すぐにできる対策がいくつかあります。
まず、ウェブサイトに表示する際に魅力的に見えるように、投稿を表示する際のレイアウトを工夫することです。Twitterの投稿だからといって同じサイズの正方形を並べるだけでなく、スライダーやコラージュなど違ったレイアウトで表示すれば、印象も変わり、おしゃれに見えます。EmbedSocialのフィード機能にはさまざまなレイアウトが用意されていて、クリック一つでレイアウトを変えられます。
次に、投稿に高品質の画像を使用することです。自身で投稿する場合の画像に注意することはもちろん、ハッシュタグなどで集めた画像についてもより高品質の画像のみを選ぶなどすることで、フィードはよりプロフェッショナルで洗練されたものになります。
ここではEmbedSocialを使ってWordPressの記事にTwitterの投稿を一覧で埋め込んだ、ウィジェットのデモを紹介します。
なおこれは、EmbedSocialを使用してWordPressサイトにTwitterのコンテンツを表示するための多くの方法のほんの一例に過ぎません。EmbedSocialフィード機能の製品ページを下にスクロールしていただくと、「設置イメージ」としていくつかのレイアウトをご覧いただけます。
みなさんのインスピレーションを得るために、ぜひ参照ください。
WordPressのウェブサイトにTwitterの投稿を表示したい理由はたくさんあるでしょう。例えば、みなさんの素晴らしい作品をサイトでも見せたいのかもしれないし、訪問者にあなたのTwitterアカウントを紹介したいというケースもあるでしょう。
いろいろな理由や目的に応じて、WordPressのウェブサイトにTwitterの投稿フィードを埋め込むことで得られるメリットがあるので、いくつかここで紹介します。
魅力的な投稿が並んだTwitterアカウントをお持ちの場合は、Webサイトにそのコンテンツを表示することで訪問者をサイトに長く引き留める一つの手段になります。
Twitterがサイトに埋め込まれていればサイトを離れる必要がないので、訪問者はウェブサイト上で魅力的なコンテンツを思わずスクロールし、そしてそれは、さらにあなたのサイトを探索する可能性が高くなることを意味します。
Twitterに素晴らしいコンテンツがたくさんあるけれど、画像や動画が多すぎてウェブサイトがごちゃごちゃになるのは嫌だという場合、Twitter埋め込みフィードは投稿を1つにまとめてすっきりと表示できる素晴らしい方法です。
クライアントや上司に自分の最高の作品を見せるためのポートフォリオとして使用することができます。
もしたくさんの人にウェブサイトを訪問してもらいたいなら、そのための理由を与える必要があります。Twitterの投稿フィードを埋め込むことは、誰かの興味を引き、みなさんのサイトへクリックさせる素晴らしい方法です。
そして、一度彼らがウェブサイトを訪れれば、それは購読者や顧客になる可能性を秘めているのです。
もし、みなさんが会社や製品のブランドや事業の認知度を高めようとしているのであれば、Twitterのフィードを埋め込むことは素晴らしい方法になるはずです。誰かがウェブサイトで投稿を見るたびにそのブランドに触れることになります。
そして、高品質のコンテンツと強力なビジュアル・アイデンティティがあれば、時間をかけてみなさんのブランドの認知度を高めることができます。
誰かがみなさんのウェブサイトでSNS投稿を見るたびに、彼らはあなたのコンテンツに触れ関与することができます。これにより、皆さんのブランドやSNSアカウントの周りに強力なコミュニティを築くことができます。
人々がみなさんのSNSアカウントを見つけることができるようにしたい場合、ウェブサイト上のTwitterの投稿フィードを設置しておけば、投稿をクリックした訪問者を簡単に元のソースであるTwitterアカウントにリダイレクトすることができます。
ウェブサイトの訪問者にみなさんのSNSのプロフィールを訪れたりブランドを発見する機会を提供することができるようになるのです。
Twitterの投稿をウェブサイトに埋め込むことで、サイト訪問者はウィジェットのTwitterボタンをクリックするだけで、みなさんのTwitterアカウントのプロフィールに移動することができます。
アプリ内だけでなくウェブサイト訪問者にもリーチしてTwitterのフォロワーを増やせる方法ということができるでしょう。
Twitterの投稿にアフィリエイトリンクがある場合、その投稿をウェブサイトに埋め込めばさらなる収入を得られる可能性があります。
つまり、誰かがアフィリエイトリンクをクリックするたびに、みなさんはコミッションを得ることができます。ウェブサイトからお金を稼ぐための一つの方法となるでしょう。
「ソーシャルメディアアグリゲーター（Social Media Aggregator）」とは、複数のソーシャルメディア（SNS）からコンテンツを一箇所に集めて表示することができるツールです。SNS投稿埋め込みツール、と呼ぶこともあります。これは、フォロワーや顧客のための情報を一つに集約したい個人や企業両方にとって便利なものです。ソーシャルメディア・アグリゲーターは、ブログ、ニュースサイト、ソーシャルネットワーキングサイトなど、さまざまなソースからのコンテンツを表示するために使用することができます。
最も充実したソーシャルメディアアグリゲーターのひとつがEmbedSocialフィード機能で、TikTok、YouTube、Facebook、Pinterest、Instagramなどのソースを備えています。埋め込みコードを使用して、これらのソースからのコンテンツをウェブサイトやブログに表示することができます。
WordPressの公式サイト、WordPress「プラグイン（Plugins）」ページから確認できます。ここで、’Twitter feed plugin’または’Twitterウィジェット’を検索すると、複数の結果が表示されます。(日本語のプラグインページではヒットしないようです。）
Twitterの投稿に付与されている埋め込みコードをウェブサイトのHTMLに貼り付ければ可能です。ただし、プラグインやツールを使ってTwitterのAPIと接続することをお勧めします。その理由は以下の通りです。
まず、プラグインやツールを使うとTwitterのアカウントから自動的にコンテンツを取り込むことができるようになります。つまり、ウェブサイトやブログで共有したい写真や動画をそれぞれ手動で追加する必要がないのです。
次に、共有されているコンテンツを調整する機能を提供します。これは、高品質で関連性の高いコンテンツのみをウェブサイトやブログで共有したい場合に重要です。
最後に、Twitter API統合を持つプロのソーシャルメディアアグリゲーター（SNS埋め込みツール）は、コンテンツの同期において非常に信頼性が高く、彼らは常にメンテナンスされ、新しい機能で更新されています。
今回は、WordPressのウェブサイトにTwitterの投稿を埋め込み、最新のTwitterの投稿をサイトで紹介する方法について詳しく紹介しました。
その中でTwitterの公式プラグインを使用する方法と、EmbedSocialフィード機能やプラグインを使用する方法をご紹介しましたが、いずれもWordPressサイト上でTwitterのコンテンツを美しく表示することができます。
投稿の表示をもっとコントロールしたい場合や、他のTwitterユーザーのUGC（ユーザー生成コンテンツ）を表示する必要がある場合は、EmbedSocialフィード機能のご利用をお勧めします。投稿フィードをカスタマイズして、必要なコンテンツだけをウェブ上に表示することができる強力なツールです。
WordPressサイトにTwitterの投稿を埋め込む方法についてのこの記事が、皆さんのお役に立てれば幸いです。
【2023年6月更新】インスタグラム新機能・アップデート情報まとめ
WordPressウェブサイトにインスタグラムを埋め込む方法まとめ
インスタグラムをウェブサイトやブログに埋め込み表示する方法
FeedlinkがSNS運用＆ブログ作成ツールとして進化
UGCツール詳細比較！目的別おすすめ製品や選び方を解説
【弁護士監修】X（旧Twitter）投稿のWEBサイト掲載は違反になる？コンテンツの著作権について詳しく解説
