サイト上でX(Twitter)のフィードを集約する方法:ステップバイステップガイド
ホーム ブログ サイト上でX(Twitter)のフィードを集約する方法:ステップバイステップガイド

サイト上でX(Twitter)のフィードを集約する方法:ステップバイステップガイド

ツイッターのフィードをサイトに集約する方法

ウェブサイトを運営している人の多くは、さまざまなアイデアや意見を表現したいと考えています。私がウェブサイト制作やオンラインマーケティングに携わってきた経験から、異なる視点を融合させることで、サイトがより生き生きとして、時代を感じさせるものになると実感しています。

X(ツイッター)は多様な会話で盛り上がるプラットフォームだ。

もし、ウェブサイト上で複数のX(Twitter)フィード(例えば、異なるチームメンバー、イベントの登壇者、あるいは関連組織のものなど)を表示することでメリットが得られるのであれば、それらのフィードを集約するのが優れた解決策となります。

簡単な答え: サイト上でX(Twitter)のフィードをまとめて表示する最も簡単な方法は 、「Smash Balloon X (Twitter) Feed Pro」のようなWordPressプラグインを利用することです。このプラグインを使えば、3ステップのガイドに沿った設定を行うだけで、複数のアカウント、ハッシュタグ、リストからのXの投稿を1つのフィードにまとめることができます。

X(Twitter)のフィードを集約して表示することで、複数の情報源からのX(Twitter)投稿を、サイト上で直接、一元的に表示することができます。これにより、訪問者は関連するX(Twitter)上の議論について、より豊かで包括的な情報を得ることができます。

この記事では、さまざまなアカウントのX(Twitter)のコンテンツを1つの動的な表示にまとめる手順を、段階を追って解説します。

この記事で

X(Twitter)アグリゲーターとは何ですか?

X(Twitter)アグリゲーターとは、自分のウェブサイトにX(Twitter)の投稿を表示するために使用できるツールです。

X(Twitter)専用のソーシャルメディアフィードアグリゲーターを使用すれば、X(Twitter)のコンテンツをフィードとして整理し、それらのフィードをページやサイドバー、フッターに埋め込むことができます。

複数の情報源からコンテンツを収集するフィードは、単一のアカウントだけでは到底及ばないほど、訪問者にスクロールを続ける動機を与えます。その結果、ページ滞在時間が長くなり、検索エンジンがクロールできる新鮮でキーワード豊富なコンテンツも増えることになります。

これはほんの始まりに過ぎない!X(Twitter)アグリゲーターがあなたのビジネスに役立つ方法は他にもいくつかあります:

  • ブランドアカウントとブランドハッシュタグを組み合わせることで、訪問者は自社の投稿だけでなく、誰が自社について話しているのかという全体像をより明確に把握できるようになります。
  • 自社製品のレビューや体験談を掲載することで、X(Twitter)を本格的なUGCギャラリーとして活用し、より多くの人々に購入を促すことができます。
twitterレビューフィードの例
  • X(Twitter)の画像アグリゲーターを使えば、一目で人々の注目を集める美しいビジュアルコンテンツを掲載することもできます。
  • 単一のアカウントのフィードは、単にあなたがアクティブであることを示すに過ぎません。一方、自分のアカウントとコミュニティからのメンションをまとめたフィードは、人々が実際にあなたと交流していることを証明するものです。

このように、X(ツイッター)アグリゲーターはあなたのウェブサイトにとって大きな助けとなります。より多くの売上を獲得し、ソーシャルメディアでの存在感を高め、より多くの顧客にリーチするなど、多くのことが可能になります。

もし将来的にX(Twitter)のフィードに、Instagram、Facebook、YouTubeのフィードも組み合わせたい場合は、Social Wallを使えばそれらを1つの画面にまとめて表示できますが、ひとまず今は、X(Twitter)のフィードを集約することに焦点を当てましょう。

ソーシャルメディアアグリゲーターを使って、X(Twitter)のフィードを表示する準備はできましたか?

WordPressサイトでX(Twitter)のフィードを集約する最も簡単な方法を見てみましょう。

X(ツイッター)フィードをWordPressに集約する最も簡単な方法

市場に出回っているX(Twitter)の集約ツールのほとんどを試してみました。そのほとんどは、何かを犠牲にしなければなりません。ブランディングの管理権を失ったり、1つのアカウントに縛られたり、あるいは無料プランは一見良さそうに見えても、実際に複数のフィードが必要になると不便になるといった具合です。

Smash Balloon X (Twitter) Feed Proは、そうしたトレードオフを強要しないため、私が何度も利用し続けているアプリです。

「X(Twitter)Feed Pro」の比較

Native X(Twitter)埋め込みウィジェット無料のアグリゲーター(Curator、Juicerなど)X(Twitter)Feed Pro ⭐ おすすめ
1つのフィードに、複数のアカウント、ハッシュタグ、またはリストをまとめて表示することはできますか?❌ いいえ — 情報源は1つだけ⚠️ 通常、無料プランでは1~3つの情報源が利用可能です✅ はい — ソース数に制限なし、フィードの種類を自由に組み合わせ可能
サイトのデザインに合っていますか?❌ いいえ — X(Twitter)のスタイルを固定⚠️ 無料プランでは、色やレイアウトのカスタマイズに制限があります✅ はい — 7つのテンプレート、ライブカスタマイザー、テーマの設定を継承
フィードにブランド関連のコンテンツや広告はありますか?✅ なし❌ ほとんどの無料プランでは、ツール独自のブランドロゴや広告が表示されます✅ なし
最適埋め込み投稿が1つあるだけで、それ以外は何もありません導入を決める前に、無料でコンセプトを試してみるブランドイメージを徹底した、信頼性の高い集約フィード

単にXの投稿を1つだけ埋め込みたいだけなら、X(Twitter)の標準ウィジェットで十分です。サイトの一部のように見える集約フィードが欲しい場合は、「X(Twitter)Feed Pro」を使う方が手っ取り早いでしょう。

実際、このプラグインでは3つのステップで設定を順を追って案内してくれます。コードエディタを開く必要も、埋め込みコードを管理する必要も一度もありませんでした。

X(Twitter)のフィードをWordPressに集約する最も簡単な方法は、Smash Balloon X(Twitter)Feed Proを使用することです。

X(Twitter)のフィードをさらに魅力的なものにするために、用意されている美しいテンプレートのコレクションからお好みのものを選ぶことができます。お好みのテンプレートを選ぶだけで、X(Twitter)のフィードがそのデザインに即座に反映されます。

さらに、リアルタイムプレビュー機能を使ってX(Twitter)のフィードの表示方法をカスタマイズできるライブフィードエディタも利用できます。

そうすれば、レイアウトや配色、Xの投稿数、フィードのサイズ、ヘッダーのスタイルなどを、素早く簡単に変更できます。

ツイッター・ライブ・ストリームで利用可能なレイアウト

さらに、「X (Twitter) Feed Pro」を使えば、X (Twitter) のハッシュタグフィードやリスト、詳細検索結果など、さまざまな方法でX (Twitter) のコンテンツを集約することができます。 

実際、「X (Twitter) Feed Pro」は現在、15万人以上のユーザーから 4.9/5の評価を得ており、このアプリを信頼できると感じているのは私だけではないことがわかります。

ツイッターフィードプロのレビュー

X(Twitter)のフィードを集約して、ビジネスを成長させる準備はできていますか?こちらから「X(Twitter)Feed Pro」を入手してください。

それでは、チュートリアルを始めましょう。X(Twitter)のフィードを最も簡単な方法で集約する方法をご紹介します。

ウェブサイトでX(Twitter)のフィードを簡単に集約する方法

簡単に説明すると、次の通りです。「X(Twitter)Feed Pro」をインストールし、新しいフィードを作成してコンテンツの種類を選択し、アカウントを連携させ、ライブエディタでデザインをカスタマイズし、ページやサイドバー、フッターに埋め込みます。

この一連の作業は、ほとんどの人にとって10分もかかりません。さっそく始めましょう!

ステップ 1:Smash Balloon X (Twitter) Feed Pro をインストールする

こちらから「X (Twitter) Feed Pro」プラグインを入手し、他のWordPressプラグインと同じようにインストールしてください。

これまでインストールしたことがないという方のために、WPBeginnerのガイドでは、2分足らずでその手順を解説しています。

プラグインをインストールして有効化したら、ステップ2でX(Twitter)のコンテンツの集約を開始できます。

ステップ 2: アグリゲート X(Twitter)フィードを作成する

これで、「X (Twitter) Feed Pro」を使って、ご自身のサイトに新しいフィードを作成できるようになりました。

そのためには、WordPressのダッシュボードから「X(Twitter)フィード」»「すべてのフィード」メニュー に移動してください。新しいページで、上部にある「新規追加」ボタンをクリックしてください。

カスタムツイッターフィードを追加

これにより、あなたのウェブサイトに新しいX(Twitter)フィードが作成されます。次に、このフィードを使ってどの種類のX(Twitter)コンテンツを集約するかを選択できます。

4種類のフィードタイプから選択でき、それぞれが異なる種類のX(Twitter)コンテンツを集約します:

  • ユーザーのタイムライン: X(Twitter)のユーザープロフィールからX件の投稿を表示する
  • ハッシュタグ: 特定のハッシュタグが付いたXの投稿を埋め込む
  • 検索: X(Twitter)の検索結果を表示する
  • リスト: 特定のX(Twitter)リストに登録されているアカウントによる投稿をX件表示する

ここで実際に集約が行われます。さらに、複数のオプションを選択した場合、X (Twitter) Feed Pro はそのすべてから情報を取得し、1つのフィードにまとめます。

1つ以上のフィードの種類を選択し、「次へ」をクリックしてください。

オプションとしてTwitterのハッシュタグフィードを選択してください

このチュートリアルでは、実例としてX(Twitter)のハッシュタグフィードを選んで説明していきます。

これで、ウェブサイトに新しいX(Twitter)フィードが表示されるようになりました。次のステップでは、これをX(Twitter)アカウントに連携させることができます。

ステップ3:X(ツイッター)アカウントに接続する

「X (Twitter) Feed Pro」を使えば、わずか数回のクリックで新しいフィードをX (Twitter) に連携させることができます。

始める準備はできましたか?ポップアップで「接続」 ボタンをクリックしてください。

ツイッターアカウントをワードプレスに接続

読み取り専用アクセスを求める権限画面が表示されます。これは、このプラグインがあなたのXの投稿を取得することはできますが、あなたに代わって投稿したり、フォローしたり、何かを変更したりすることはできないことを意味します。

「アプリを承認」をクリックすれば、接続が完了します。

ツイッターの読み取り専用アクセスを許可する.jpg

そうすると、再びWordPressのウェブサイトに戻ります。ここから、X(Twitter)フィードのソースを選択できるようになります。

つまり、ポップアップ画面にX(Twitter)のユーザー名、ハッシュタグ、検索キーワード、X(Twitter)のリストなどを入力できます。そうすると、フィードにそのソースからのXの投稿が表示され始めます。

先ほどハッシュタグフィードタイプを選んだので、この例ではハッシュタグを入力します。

その後、[Next]ボタンをクリックして続行します。

ツイッターフィードのハッシュタグを選択する

X(Twitter)アカウントを連携し、ソースを選択したことで、フィードはX(Twitter)のコンテンツを集約する準備が整いました。

フィードをウェブサイトに追加する前に、ステップ4で見た目をカスタマイズすることができます。

ステップ4:X(Twitter)のフィードをカスタマイズする

「X (Twitter) Feed Pro」を使えば、フィードが自動的にウェブサイトのデザインを反映し、インストールしたその日から見栄えのよい表示になります。

また、X(Twitter)のフィードをさらに細かく管理したい場合は、利用できるカスタマイズオプションが数多く用意されています。

まず、X(Twitter)のフィードに使用するテンプレートを選択できます。ここでは、7種類のフィードテンプレートから選ぶことができます:

  • デフォルト
  • 石工
  • シンプルなカルーセル
  • シンプルなカード
  • ショーケース・カルーセル
  • 最新のXの投稿
  • ウィジェット

お好みのフィード・テンプレートを選択し、「次へ」ボタンをクリックします。

フィードテンプレートを選択する

テンプレートを選んだ後は、ライブフィードエディタを使って、X(Twitter)のフィードをさらにカスタマイズすることができます。

左側には、カスタマイズパネルがあります。そこにあるオプションを使って、フィードのレイアウト、配色、ヘッダーのスタイル、ボタンのデザインなどを設定することができます。

ライブフィードエディタ twitterフィードプロ ビジュアルプレビュー

これらのオプションを使用すると、右側に変更内容のライブプレビューが表示されます。これにより、X(Twitter)のフィードがどのように表示されるかをリアルタイムで確認できます。

始めるには、左側にあるフィードレイアウトオプションを探して クリックします。

フィードレイアウトオプションを選択し、Twitterフィードを作成する

ここから、X(Twitter)のフィードのレイアウトを「リスト 」、「メイソンリー」、「 カルーセル 」 の3種類から選択できます。

フィードレイアウトオプション

Xの投稿ごとに、ページ上でより多くのスペースを確保したいですか?

リストのレイアウト を選択すると、すべてのXの投稿が1列に表示されます。

ツイッター・リスト・レイアウト・アグリゲーター

X(Twitter)のコンテンツを一度に大量にまとめたい場合は、メイソンリーレイアウト が役立ちます。

このオプションを選択すると、Xの投稿が一度にたくさんの異なる列に表示されます。

石積みのレイアウト ツイッターフィード

最後に、X(Twitter)の美しいスライドショー形式のカルーセルを使って、X件の投稿を表示する「カルーセルレイアウト 」をご紹介します。

その結果、ページ上のスペースをあまり取らずに、たくさんのXの投稿を表示することができます。

カルーセルレイアウト

使用したいX(Twitter)のフィードレイアウトを選んだら、「保存」をクリックしてください。

X(Twitter)のフィードのデザインをさらに編集するには、上部にある小さな「カスタマイズ」ボタンを クリックしてください。

メインメニューに戻る ライブフィードエディター

次に、左側の「カラースキーム」オプション をクリックして、X(Twitter)フィードの色設定を開始できます。

配色を選ぶ twitterフィード

このプラグインを使えば、カラースキームを選択するだけで、X(Twitter)のフィードのすべての色を一度に瞬時に変更できます:

  • テーマからの継承: ウェブサイトのテーマと同じ色を使用する。
  • ライト明るい背景と暗いフォントでフィードを表示します。
  • 暗い:暗い背景と明るいフォントを選ぶ。
  • カスタム: 手動で色を選択
ツイッターフィードの配色オプション

好みの配色を選択し、もう一度「保存」をクリックする。

全体として、ライブフィードエディタは、フォント、ヘッダーのスタイル、テキストの長さ、そして「さらに表示」ボタンなど、ほとんどのユーザーが実際に気にする詳細を網羅しており、編集するにつれてプレビューもリアルタイムで更新されます。

最後にSave ボタンをクリックして変更を確定します。

X(Twitter)のフィードのスタイル設定が完了したら、次はそれをWordPressサイトの以下の場所に埋め込みましょう。

ステップ5:WordPressサイトにX(Twitter)のフィードを埋め込む

収集したX(Twitter)のコンテンツをサイトに表示するには、以下の2つの方法から選択できます:

  • WordPressのページに「Aggregate X(Twitter)」のフィードを表示する
  • WordPressのサイドバーまたはフッターに「Aggregate X(Twitter)」のフィードを表示する

この2つの方法の使い方を以下に見てみよう。

WordPressのページに「Aggregate X(Twitter)」のフィードを表示する

この方法を使えば、ページ上にX(Twitter)のコンテンツを表示させ、それをメインの注目ポイントとして訪問者の関心を引くことができます。さらに、ライブフィードエディタから直接その設定を行うことも可能です。

上部の埋め込み ボタンをクリックするだけで、すぐに始められます。

ライブフィードエディタ埋め込みボタン

その操作を行うと、X (Twitter) Feed Pro から、X (Twitter) フィードをどこに埋め込むか尋ねるポップアップが表示されます。

続行するには、「ページに追加」をクリックします。

ページに追加する

その後、あなたのウェブサイトにあるページのリストを見ることができます。

リストから、X(Twitter)のコンテンツを集約したいページを選択し、その下の「追加」ボタンを クリックしてください。

新しいページにツイッターフィードを追加する

これで、プラグインがそのページへ遷移させ、WordPressのエディタを使ってX(Twitter)のフィードを埋め込めるようになります。

まず、プラス(+)アイコンをクリックして、エディターにコンテンツブロックを追加します。

新しいワードプレスブロックを追加する

検索バーを使って、「Twitterフィード」ブロックを探してください。次に、その下の検索結果にある「X(Twitter)フィード」をクリックしてください。

ワードプレスサイトにツイッターフィードを埋め込む

最後に、「公開 」または 「更新 」をクリックして変更を確定すると 、X(Twitter)のフィードがオンラインになります。

これで、フィードがX(Twitter)のコンテンツを集約し、訪問者に表示するようになります。WordPressのページを開けば、その様子を確認できます。

ウェブサイト上のtwitterフィードの例

ウェブサイト上でXの投稿を表示するもう1つの方法は、X(Twitter)のフィードウィジェットを表示することです。

まず、ダッシュボードから「X(Twitter)フィード」»「すべてのフィード」メニューに移動してください。このページでは、自分が作成したすべてのX(Twitter)フィードを確認できます。

次に、先ほど作成したX(Twitter)フィードをクリックして、ライブフィードエディタで開きます。

オープン・ハッシュタグ

ライブフィードエディターから、右上の埋め込み ボタンをクリックして開始します。

ライブフィードエディタ埋め込みボタン

ポップアップで、ウィジェットに追加 オプションをクリックして続行します。

その操作を行うと、X (Twitter) Feed Pro によって WordPress のウィジェットページに移動します。

ウィジェットにtwitterフィードを追加

ここでは、X(Twitter)ウィジェットを埋め込みたい場所を選択できます。

サイドバーにX(Twitter)のコンテンツを表示するには、「サイドバー」パネル を選択してください。

サイドバーパネルを開く

フッターにX件の投稿を表示したい場合は、「フッター」をクリックしてください。

この例では、ウェブサイトのサイドバーを使います。

フッターパネルを開く

それでは、下部にあるプラス記号(+) をクリックして、新しいX(Twitter)ウィジェットを追加してください。

最後に、オプションから「X(Twitter)フィード」ウィジェットを選択してください。

ワードプレスにツイッターフィードウィジェットを追加

上部の「更新」ボタンをクリックすると、新しいX(Twitter)ウィジェットが公開されます。

それでは、ウェブサイトを開いてみてください。フッターやサイドバーに、X(Twitter)のコンテンツがまとめられて表示されているのが確認できるはずです。

ワードプレスのサイドバーにツイッターフィードを埋め込む

インストールからライブの集約フィードの表示まで、設定は以上です。この仕組みの真価は、時間が経つにつれて明らかになります。新しいXの投稿を手動で貼り付ける必要はなく、そのハッシュタグで新しいアクティビティがあるたびに、フィードが自動的に更新されるのです。

後で2つ目や3つ目のソースを追加しても、追加の設定は一切必要なく、これまでとまったく同じように動作し続けます。

ここからは、ユーザーが改めて操作しなくてもフィードは自動的に最新の状態に保たれます。そもそも、静的なXの投稿を1つずつ手動で埋め込むのではなく、フィードをまとめて表示する意義はまさにここにあるのです。

X(Twitter)のフィードを集約する準備はできましたか?こちらから「X(Twitter)Feed Pro」を入手してください。

この機会に、X(Twitter)で稼ぐためのベストな方法のリストをぜひご覧ください。

また、サイトに追加できるおすすめのX(Twitter)ウィジェットの事例を紹介した次の記事もぜひご覧ください。

著者アバター
サジャン・シャルマ シニアライター
WordPress、ソーシャルメディアマーケティング、オンラインビジネスについて10年以上執筆。専門分野はインフルエンサーマーケティング、コンテンツキュレーション、デジタルマーケティング戦略など多岐にわたる。

コメントを追加する

コメントをお寄せいただきありがとうございます。すべてのコメントはプライバシーポリシーに従って管理され、すべてのリンクはnofollowであることにご留意ください。名前欄にはキーワードを使用しないでください。個人的で有意義な会話をしましょう。