ソーシャルメディアのマーケティング担当者として、X(Twitter)のフィードをネイティブの埋め込み機能を使って思い通りの見た目に仕上げるのは、特に横向きのスライダーやカルーセルといった特定のレイアウトにしたい場合、なかなか厄介なことだということはよく分かっています。
X(Twitter)のデフォルトの埋め込み機能では、縦型のタイムラインしか作成できず、横型のオプションは組み込まれていません。
私はSmash Balloonで働いていますが、この作業で頼りにしているのは「Smash Balloon X (Twitter) Feed Pro」というプラグインです。このプラグインにはカルーセルレイアウトが組み込まれているため、コードを1行も書かずにX(Twitter)のフィードを横並びで表示することができます。
要するに:WordPressで横長のX(Twitter)フィードを作成するには、「Smash Balloon X (Twitter) Feed Pro」をインストールし、新しいフィードを作成して、設定時に「Simple Carousel」テンプレートを選択します。これで、ワンクリックで横スクロール形式のレイアウトが完成します。
セットアップには全部で5分ほどかかります。以下で手順を一つひとつご説明します。
この記事では、横向きのX(Twitter)フィードを設定する方法を、手順を追って詳しくご紹介します。このガイドはどなたでもご利用いただけるよう作成されていますので、プログラミングの知識は一切必要ありません。
この記事で
Twitterの横方向のXフィードを追加する最も簡単な方法
ウェブサイトに横長のX(Twitter)フィードを手動で埋め込むことは可能です。ただし、その場合、次のような多くの制限があることを知っておく必要があります:
- 設定が難しい: WordPressの横向きレイアウトテンプレートにXの投稿を手動で埋め込む 場合 、HTML、PHP、JavaScript、カスタムCSSなど、多くのコードを扱う必要があります。
- カスタマイズが難しい: デフォルトのX(Twitter)のレイアウトやデザインから変更することはできません 。そのため、X(Twitter)のフィードのレイアウトを横スクロール形式に変更したい場合は、開発者を雇うために費用がかかる可能性があります。

- 危険:WordPressウェブサイトの埋め込みコードをいじろうとしたことがありますか?ほんの小さなミスをしただけで、恐ろしい「エラー」ページが表示され、修正に多くの時間とリソースを取られてしまうかもしれません。
- Xの投稿に対する管理機能が限られている:Xの投稿を管理して、表示したいコンテンツだけを表示させたいですか?X(Twitter)では、これもできません。
- あなたを優先的にサポートしてくれる人はいない:サイトを台無しにしてしまった?それともどうすればいいかわからない?X(Twitter)には、あなたをサポートする専任のサポートチームはありません。つまり、自分一人で対処するしかないのです。
もしX(Twitter)で、自分のX(Twitter)フィードをサイトに横向きで埋め込むのが難しい場合、最善の方法は何でしょうか?
WordPress向けの最高のX(Twitter)フィードプラグイン「Smash Balloon X (Twitter) Feed Pro」を使えば、あらゆる作業をより簡単かつ迅速に行うことができます。

この初心者にも使いやすいプラグインを使えば、WordPressサイトにX(Twitter)の横型フィードを簡単に追加できます。
そう、セットアップのためにコードの行をいじる必要もない。
そして、何より素晴らしいのは?カルーセルレイアウトが標準で搭載されていることです。そのため、X(Twitter)のフィードも横向きで簡単に表示できます。

また、ユーザーを念頭に置いて設計されているので、プラグインがあなたのウェブサイト上で超高速でロードされることを確認することができます。そして、より速いウェブサイトはより良いSEOを意味するので、あなたのサイトは検索エンジンの結果で上位にランクされます。
さらに、4.9/5という高評価を獲得しているこのカスタムX(Twitter)フィードプラグインは、10万人以上のアクティブユーザーから好評を博しています。

「X (Twitter) Feed Pro」は、ウェブサイトの機能を拡張し、サイト上にX(Twitter)のコンテンツを表示できるようにします。このプラグインの主な機能は以下の通りです:
- 設定は超簡単:プラグインをインストールして設定を行うだけで、わずか数クリックで横長のX(Twitter)フィードを表示できます。技術的な知識は一切必要ありません!
- インストールしただけで見栄えが抜群:このWordPressX(Twitter)フィードプラグインは、使用中のテーマのデザインを自動的に引き継ぎます。そのため、ブランドのビジュアルアイデンティティや既存のWordPressテーマと統一感を持たせることができます。
- 簡単にカスタマイズ可能: 当社のライブフィードカスタマイザーを使用すると、簡単に水平スクロールレイアウトを有効にしたり、色を変更したり、ボタンのレイアウトを設定したりすることができます。

- コードをいじる必要なく、X(Twitter)のフィードを追加できます。このプラグインの既成ウィジェットを使えば、サイドバーやフッターにスクロール式のX(Twitter)フィードウィジェットを簡単に埋め込むことができます。
- SEOに最適化されています:このプラグインはSEOを念頭に置いて作成されているため、検索エンジンの検索結果で上位に表示されやすく、より多くの潜在顧客にアプローチすることができます。
- コンテンツを完全に管理できます:プラグインのモデレーション機能を活用して、カスタムX(Twitter)フィードに表示したいXの投稿だけを表示させることができます。
このプラグインには他に何が付属しているかご存知ですか?フレンドリーで親切なサポートチームに連絡することができる。彼らは、あなたが手を差し伸べてくれる誰かを必要とするときはいつでも、いつでもあなたを助けることに専念している。
このプラグインを使ってX(Twitter)をウェブサイトに連携させることの、もうひとつの魅力は?
Smash Balloonの「X(Twitter)Feed Pro」は、ソーシャルプルーフを表示するツールとして、世界中の大手ブランドからも厚い信頼を寄せられています。つまり、あなたも一流の企業やブランドと肩を並べていることになるのです!

ご覧の通り、このX(Twitter)フィードプラグインを使えば、ソーシャルメディアプラットフォームのコンテンツを簡単に埋め込むことができます。
ブランドのX(Twitter)アカウントのエンゲージメントを高めたいですか?今すぐ「X(Twitter)Feed Pro」を入手しましょう!
ワードプレスに横長のX(ツイッター)フィードを埋め込む方法
以下の方法を使えば、WordPressでローテーション表示されるX投稿を数分で設定できます。
始めよう。
ステップ1:X(Twitter)Feed Proプラグインをインストールする
まずは、こちらから「Smash Balloon X (Twitter) Feed Pro」プラグインを入手してください。プラグインをパソコンにダウンロードし、WordPressサイトにインストールしてください。
WordPressプラグインのインストールについて復習が必要ですか?
あなたのサイトにWordPressプラグインをインストールする方法については、この有用なチュートリアルに従うことができます。ステップバイステップで説明されているので、簡単に行うことができます。
ステップ 2:新しい X(Twitter)フィードを作成する
ガイド付きフローを利用すれば、ウェブサイトに新しいX(Twitter)フィードを簡単に作成できます。
まず、WordPressのダッシュボードから「X(Twitter)フィード」»「すべてのフィード」メニューに移動します。
このページで、新規追加 ボタンをクリックします。

Twitterのタイムラインを作成し続けるには、フィードの種類を選択する必要があります。
「X (Twitter) Feed Pro」では、さまざまなフィードタイプから選択することができます:
- ユーザーのタイムライン:X(Twitter)のタイムラインから、最近の投稿やリポストをX件表示します。
- ハッシュタグ:選択した特定のハッシュタグに基づいて、X件の投稿を表示します。
- 検索: 検索語句を入力し 、一致するX(Twitter)の投稿を埋め込みます。
例として、ハッシュタグ「X」(Twitter)のフィードを表示することにしました。
X(Twitter)のフィードの種類を選択したら、「次へ」ボタンを クリックしてください。

ステップ3:X(ツイッター)アカウントに接続する
X(Twitter)アカウントを連携させることで、ウェブサイトにX(Twitter)のコンテンツを表示することができます。
開始するには、ポップアップの接続 ボタンをクリックします。

クリックすると、プラグインによってX(Twitter)にリダイレクトされます。そこで、プラグインにX(Twitter)アカウントへの読み取り専用アクセス権を 付与することができます。
読み取り専用のアクセス権であるため、「X (Twitter) Feed Pro」はお客様のアカウントに一切の変更を加えることはできません。
「アプリを承認」ボタンをクリックして、X(Twitter)アカウントを連携してください。

あっという間に、フィードをX(Twitter)に連携できました。アクセストークンやAPIの設定など、面倒な作業は一切必要ありません!
その後、プラグインが再びウェブサイトを開くので、X(Twitter)フィードの設定を完了させてください。
特定のユーザーアカウント、ハッシュタグ、検索キーワードなどを入力することで、ウェブサイトに表示する内容を選択できるようになった。
このチュートリアルでは、ポップアップにX(Twitter)のハッシュタグ「#KEEB_PD」を追加します。
ソースを追加したら、Next ボタンをクリックします。

ステップ4:横レイアウトを有効にする
ソースを接続すると、プラグインがお好みのテンプレートを選択するように尋ねます。
これらのテンプレートを使えば、X(Twitter)のフィード用に独自のデザインを素早く作成できます。つまり、テンプレートを使えば、WordPressにX(Twitter)のカルーセルを簡単に追加できるということです。
X(Twitter)のフィードを横向きに表示するには、「Simple Carousel」テンプレートを選択し、「次へ」をクリックしてください。

これにより、X(Twitter)のフィードが横並びのレイアウトになり、次のような表示になります:

ステップ5:横長の「X」(Twitter)フィードのデザインを調整する
WordPress X(Twitter)フィードのカルーセルレイアウトの選択は完了しましたか? よかったですね!
これで、プラグインがライブフィードエディタ内で横向きのX(Twitter)フィードを開き、デザインをカスタマイズできるようになります。
左側には、すべてのカスタマイズオプションがあります。これらを使って、配色、フィードレイアウト、フィードサイズ、投稿数などを設定できます。

右側にはフィードのライブプレビューも表示されています。これにより、X(Twitter)のフィードをリアルタイムでプレビューすることができます。
始めるには、左側のフィードレイアウトオプションを クリックします。

左側の画面を下にスクロールすると、横方向のX(Twitter)フィードを設定するためのオプションが表示されます。
カルーセル設定 オプションでは、ナビゲーション矢印、ページネーションドット、自動再生の有効・無効を設定できます。
その下では、X投稿の数、行数、カルーセルのサイズ、間隔時間、ループの種類など、さまざまな設定を選択できます。

お好みのオプションを選択し、「保存」をクリックします。
もう一度メインオプションに戻るには、左上隅にあるカスタマイズ ボタンをクリックします。

それでは、新しいX(Twitter)のフィードの色を変えてみましょう。
左の「配色」 オプションでそれができる。

ここから、横長のX(Twitter)フィードの配色を4種類の中から選ぶことができます。
- テーマから継承: ウェブサイトの色をコピーする
- 明るい:明るい背景に暗いフォント
- Dark:暗い背景と明るいフォント
- カスタム: 手動ですべての色を選ぶ

オプションから配色を選択し、「保存」をクリックして続行するだけです。
次に、上部にあるカスタマイズ ボタンをクリックして、もう一度メインオプションに戻ることができます。

ご覧の通り、ライブフィードエディタを使えば、X(Twitter)のフィードの残りの部分を簡単にカスタマイズすることができます。
ボタンを数回クリックするだけで、フィードのヘッダーの変更、ボタン「もっと見る」の追加、X(Twitter)カードのデザイン変更など、さまざまな設定が可能です。分かりにくいコードの断片を扱う必要も、開発者に依頼する必要もありません。
横スクロール式のX(Twitter)フィードの見た目に満足したら、「保存」ボタンを クリックしてください。
ステップ6:WordPressに横向きのX(Twitter)フィードを埋め込む
これで、この横長のX(Twitter)フィードをウェブサイトに埋め込むことができます。
「X (Twitter) Feed Pro」を使えば、ウェブサイトのページ、サイドバー、フッターの各エリアにフィードを表示することができます。
WordPressのページに横向きのX(Twitter)フィードを埋め込む
カスタムX(Twitter)フィードを埋め込むには、プラグインのビジュアルフィードカスタマイザーを使えば簡単です。
まず、右上の埋め込み ボタンをクリックします。

X(Twitter)のフィードを、ページまたはウィジェットエリアに埋め込むかどうかを選択できるようになりました。また、このポップアップからショートコードをコピーすることもできます。
とりあえず、Add to a Page ボタンをクリックして続けます。

次に、横長のX(Twitter)フィードを埋め込みたいページを選択し、「追加」ボタンをクリックしてください。

WordPressエディターでページが開いているのが見えます。ここで、プラス(+)アイコンをクリックして、新しいコンテンツブロックを追加できるようにします。

それが終わったら、検索ボックスに「twitter feed」と入力し、「X(Twitter)フィード」ウィジェットをクリックして、フィードを埋め込んでください。

公開」または「更新」 ボタンをクリックする前に、自由にページの内容を編集し、すべてが見栄え良くなっていることを確認してください。
そうすれば、ウェブサイトの訪問者は、サイトにアクセスするたびに横長のX(Twitter)フィードを見ることができるようになります。

サイドバーやフッターに横向きのX(Twitter)フィードを埋め込む
サイトのサイドバーやフッターに、X(Twitter)フィードウィジェットとしてフィードを追加したい場合は、ライブフィードエディタもご利用いただけます。
まず、WordPressのダッシュボードから「X(Twitter)フィード」»「すべてのフィード」メニューに移動します。
次に、埋め込みたい横長の「X(Twitter)」フィードをクリックします。

さて、このX(Twitter)フィード用WordPressプラグインを使えば、フィードが再びライブエディタで開かれるようになります。
前回同様、上部にある埋め込み ボタンをクリックして次に進む。

ポップアップ画面で、X(Twitter)のフィードをウィジェットとして埋め込むかどうかを選択できます。次に、「ウィジェットに追加」ボタンを クリックしてください。

そうすると、プラグインはウィジェットページを開き、そこでWordPressウェブサイトのすべてのウィジェットを管理することができます。
X(Twitter)フィードの埋め込みを開始するには、こちらのサイドバーパネル をクリックしてください

フッターに フィードを埋め込みたい場合は、フッターパネルを クリックすることもできます。
この例ではフッターを使うことにする。

サイドバーまたはフッターに新しいウィジェットを追加するには、プラスアイコン(+)をクリックしてください。
最後に、「X(Twitter)」フィードウィジェット を探して、それをクリックしてください。

変更内容を確認するには、「更新」 ボタンをクリックします。
さて、ウェブサイトの訪問者があなたのサイトを見ると、次のように埋め込まれたX(Twitter)のタイムラインが表示されます:

それで終わりだ!
これで、サイトに横スクロール式のX(Twitter)フィードを簡単に追加する方法がわかりましたね。「X(Twitter)Feed Pro」を使えば、わずか数分でさまざまな方法でX(Twitter)のコンテンツを埋め込むことができます。
そうするだけで、X(Twitter)でのエンゲージメントを高め、ブランド認知度を向上させるのがずっと簡単になります。その結果、長期的にビジネスを成長させることができるのです。
X(Twitter)のフィードを埋め込む準備はできましたか?今すぐ「X(Twitter)Feed Pro」を使い始めましょう。
ソーシャルメディアのフィードを表示する方法をもっと知りたいですか?WordPressにInstagramのフィードを埋め込む方法については、こちらのガイドに従ってください。
WordPressにおけるHorizontal X(Twitter)フィードに関するよくある質問
X(Twitter)には、横向きのフィードレイアウトが標準で搭載されていますか?
X(Twitter)のネイティブ埋め込み機能は、縦型のタイムラインのみに対応しています。公式の横型やカルーセル形式のオプションはありません。WordPress上でX(Twitter)のフィードを横スクロール形式で表示するには、「Smash Balloon X(Twitter)Feed Pro」のようなプラグインが必要です。このプラグインには、すぐに使えるカルーセルテンプレートが組み込まれています。
WordPressでX(Twitter)のフィードを横方向にスクロールさせるにはどうすればよいですか?
Smash Balloon X (Twitter) Feed Pro では、フィードの設定時に「Simple Carousel」テンプレートを選択します。これにより、Xの投稿が横並びのレイアウトで表示され、オプションで自動再生、ナビゲーション矢印、ページネーションドットを設定できます。ライブエディタから、コードを一切触ることなく、表示されるXの投稿数、スクロール速度、カルーセルのサイズを調整できます。
カルーセルに一度に表示されるXの投稿数を調整するにはどうすればよいですか?
ライブエディタ内の「フィードレイアウト」設定では、一度に表示されるX投稿の数、表示する行数、各カードのサイズ、自動再生の間隔を詳細に設定できます。多くのサイトでは、1画面あたり3~5件のX投稿を表示しており、フィードが活気ある印象を与えつつも、情報過多にならないようにしています。
X(Twitter)マーケティングに関する人気のチュートリアルとガイド
- スマッシュ・バルーンのカスタムTwitterフィードを無料で入手する方法
- 今すぐX(Twitter)のエンゲージメントを高める最善策
- ウェブサイトにレスポンシブX(Twitter)ウィジェットを埋め込む方法
- X(Twitter)で簡単に稼ぐための実証済みの方法(専門家が厳選)
- X(ツイッター)リストをウェブサイトに埋め込む5つのステップ
今すぐ横長のX(Twitter)フィードの埋め込みを始めましょう
WordPressサイトに横向きのX(Twitter)カルーセルを導入することは、手っ取り早くデザイン上の効果を得られる方法の一つです。
カルーセルテンプレートを選択してアカウントを連携すれば、あとはフィードが自動的に処理を行い、投稿するたびに新しいXの投稿が自動的に取り込まれます。
Smash Balloon X (Twitter) Feed Pro を使えば、コーディングなしでこれを実現できます。フィードのレイアウトが特に重要なサイトでは、私がこのプラグインを使用していますが、設定には実際に5分ほどしかかかりません。
「Smash Balloon X (Twitter) Feed Pro」を入手する →
