ワードプレスサイトにX(ツイッター)のスライドショーを追加する方法
ホーム ブログ ワードプレスサイトにX(ツイッター)のスライドショーを追加する方法

ワードプレスサイトにX(ツイッター)のスライドショーを追加する方法

WordPressサイトにTwitterスライドショーを追加する方法 (1)

WordPressのウェブサイトでX(Twitter)のスライドショーを簡単に表示する方法をお探しですか?

ウェブサイトにX(Twitter)のフィードを表示することで、訪問者に関連性の高いソーシャルメディアのコンテンツを届けることができます。さらに、ブランドの認知度を高め、顧客とのエンゲージメントを促進する、斬新な方法でもあります。

しかし、X(Twitter)ではフィードのレイアウトをカスタマイズすることはできません。また、開発者を雇わずにX(Twitter)のコードをカスタマイズするのは、少々難しいです。

そこで、技術に詳しくない方でも簡単に、サイトにX(Twitter)のスライドショーを追加する方法をご紹介します。

まず、X(Twitter)のスライドショーを埋め込む最も簡単な方法を見てみましょう。

あるいは、手順 1:X (Twitter) Feed Pro プラグインをインストールして有効化してください。

X(ツイッター)のスライドショーを表示する最も簡単な方法

必要であれば、X(Twitter)のフィードをサイトに手動で埋め込むこともできますが、この方法にはいくつかの難点やリスクが伴います:

  • 設定が難しい: コーディングが苦手な人は、手動でたくさんのコードを埋め込んだり、異なるウェブページを切り替えたりしなければならないので、設定が簡単ではない。
  • 時間がかかる: コードの一行を見落とした?あるいは何か間違ったことをした?何がいけなかったのか理解するのに多くの時間が必要だ。
  • 混乱しやすく、エラーを起こしやすい:手作業で埋め込むため、小さなミスが原因で誤ってサイトを壊してしまう危険性がある。
  • カスタマイズオプションがない:X(Twitter)のスライドショーを表示したい? それはできません。WordPressにフィードを手動で追加した場合、フィードのレイアウトやスタイルを自由にカスタマイズすることはできません。
  • フィルタ機能なし:フィードのコンテンツをフィルタリングすることもできません。そのため、フィードに表示するXの投稿を管理したい場合でも、それは不可能です。

そうだとすれば、WordPressにX(Twitter)のスライドショーを埋め込むには、どのような方法が最適でしょうか? WordPress向けの最高評価を得ているX(Twitter)フィードプラグイン「X(Twitter)Feed Pro」を使用することです。

ツイッター・フィード・プロ ホームページ

この技術知識が不要なプラグインを使えば、WordPressでX(Twitter)のスライドショーを簡単に作成できます。まったくの初心者でも気軽に利用できます。

「X (Twitter) Feed Pro」を使ってウェブサイトにX (Twitter)のスライドショーを追加すると、次のような機能を利用できます:

  • 設定がとっても簡単:インストールすれば、すべての設定を完了して、X(Twitter)のフィードを簡単に表示できます。ITに詳しくない方でも大丈夫です。
  • 豊富なフィードの種類: X(Twitter)のフィード、ユーザーのタイムライン、X(Twitter)のリスト、検索結果など、さまざまなものにハッシュタグを付けることができます 。
  • 時間を節約して効率的に:簡単なガイドに従って、わずか5分弱でX(Twitter)のスライドショーフィードを表示しましょう!
  • 使いやすさ:コードをいじったり、うっかりサイトを壊してしまうリスクを心配する必要はありません。数回クリックするだけで、X(Twitter)のフィードをカスタマイズし、表示するXの投稿を管理できます。
  • 豊富なカスタマイズオプション:スライドショー形式で横向きのX(Twitter)フィードを表示したいですか?このプラグインのライブフィードエディタを使えば、複雑なコードを記述する必要はなく、ワンクリックで実現できます。
  • コンテンツを管理する:このプラグインを使えば、X件の投稿をフィルタリングして、表示したいフィードだけを表示させることができます。これは、ソーシャルメディア上の口コミを掲載してソーシャルプルーフを活用し、コンバージョン率を向上させたい場合に特に役立ちます。

そして、一番の魅力についてお伝えしましたか?「X(Twitter)Feed Pro」をご購入いただくと、WordPressの専門家による親切で迅速なサポートチームが、皆様を丁寧にサポートいたします。

助けが必要だと感じたら、彼らにメッセージを送ってください。

その結果、このプラグインは4.9/5つ星という確かな評価を得ており、15万人以上のユーザーに推奨されている。

ワードプレスサイトにX(ツイッター)のスライドショーを追加する方法

魅力的なX(Twitter)のフィードを公開して、X(Twitter)のフォロワーを増やしてみませんか?以下のステップバイステップのチュートリアルを参考に、X(Twitter)のフィードをスライドショーに埋め込んでみてください:

ステップ 1: X (Twitter) Feed Pro プラグインのインストールと有効化

まず、こちらから「X (Twitter) Feed Pro」プラグインを入手してください。その後、WordPressサイトにプラグインをインストールして有効化してください。

どうすればいいのかわからない?あなたのウェブサイトにWordPressプラグインをインストールする方法についてのユーザーフレンドリーなチュートリアルをチェックしてください。

ステップ 2:新しい X(Twitter)フィードを作成する

この手順では、「X (Twitter) Feed Pro」のガイドに従って、ウェブサイトに新しいフィードを作成することができます。

WordPressのダッシュボードから、「X(Twitter)フィード」»「すべてのフィード」メニューに移動して、設定を開始してください。

その後、上部にある新規追加 ボタンをクリックする。

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

その操作を行った後、作成したいX(Twitter)フィードの種類を指定できます。

「X (Twitter) Feed Pro」では、以下のフィードタイプから選択できます:

  • ユーザーのタイムライン:自分のX(Twitter)タイムラインからX件の投稿を表示します
  • ハッシュタグ:特定のハッシュタグが付いたXの投稿を埋め込む
  • 検索:X(Twitter)の詳細検索の結果に基づき、X件の投稿を表示します
  • リスト:特定のX(Twitter)リストからX件の投稿を表示します

この例では、ハッシュタグフィードタイプを使用しています。

X(Twitter)のフィードタイプを選択したら、「次へ 」をクリックして次に進んでください 。

ウィジェットのツイッターフィードタイプを選択します。

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

X(Twitter)アカウントを連携すると、ウェブサイト上のフィードにX(Twitter)のコンテンツを表示できるようになります。

まず、ポップアップの接続 ボタンをクリックして開始する。

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

その設定を行うと、プラグインからX(Twitter)アカウントへの読み取り専用アクセス権の付与を求められます。

X(Twitter)Feed Proはそのアクセス権を利用して何らかの変更を加えることはできないため、完全に安全です。

プラグインに読み取り専用アクセス権を与えるには、Authorize appボタンをクリックします。

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

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

そのためには、ユーザーアカウント、ハッシュタグ、検索ワード、その他サイトに表示したいソースの種類を入力すればよい。

ポップアップ画面の「X(Twitter)」の欄に情報を入力し、「次へ」をクリックしてください。

一例として、X(Twitter)のフィードではハッシュタグ「#KEEB_PD」を使用しています。

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

ステップ4:X(Twitter)のスライドショーフィード用テンプレートを選択する

X(Twitter)アカウントとプラグインの連携は完了しましたか? よかったですね!

ここで、「X (Twitter) Feed Pro」は、使用するフィードテンプレートを選択するよう求めます。

スライドショーでXの投稿を一度にたくさん表示したい場合は、「Simple Carousel」テンプレートを選択し、「次へ」をクリックしてください。

カルーセルオプションを選択 ツイッターフィード

X(Twitter)のスライドショーで、一度に1件のX投稿のみを表示したい場合は、代わりに 「Showcase」カルーセル をクリックしてください。

次に、Nextボタンをクリックして進みます。

ショーケースのカルーセルレイアウトを選ぶ

これで、あなたのウェブサイトにX(Twitter)のスライドショーフィードが表示されるようになりました。

さらに、新しいフィードは、あなたのウェブサイトのデザインを自動的にコピーするので、箱から出してすぐに見栄えが良くなります。

シンプルなカルーセルテンプレートの例

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

「X (Twitter) Feed Pro」プラグインを使えば、使いやすいライブフィードエディタを利用して、X (Twitter) のフィードを簡単にデザインすることができます。

ここでは、左側のパネルにすべてのカスタマイズオプションを見つけることができます。これらを使って、フィードテンプレート、レイアウト、色、サイズ、ヘッダースタイル、投稿数、フィードサイズなどを変更することができます。

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

右側には、X(Twitter)のフィードがリアルタイムでプレビュー表示されるため、変更内容を簡単に確認できます。

カスタマイズを開始するには、フィードレイアウトオプションを クリックします。

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

ここから、X(Twitter)のフィードにXの投稿が表示される方法を変更できます。Xの投稿をリスト形式やメゾニー形式のギャラリーとして表示することも可能です。

X(Twitter)のスライドショーの設定を変更するには、左側の画面を下にスクロールして、「カルーセルの設定」セクション を探してください。

その後、X(Twitter)のスライドショーについて、ナビゲーション用矢印、ページネーションのドット、自動再生を有効にするか無効にするかを選択できます。

さらに、行数、ループのタイプ、スライドショーの高さ、インターバル時間なども変更できる。

ツイッターの水平フィードオプションをカスタマイズする

X(Twitter)のスライドショーの設定が完了したら、「保存 」をクリックして変更を反映させてください 。

それでは、上部の「カスタマイズ」ボタンを クリックして、X(Twitter)のフィードのデザインを続けてください。

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

次に、「配色」オプション をクリックして、X(Twitter)のスライドショーの色を設定してください。

配色を選ぶ twitterフィード

「X (Twitter) Feed Pro」を使えば、カラースキームを選択するだけで、X (Twitter) のフィードの色をすべて一気に変更できます。

4つの配色から選ぶことができる:

  • テーマから継承: ウェブサイトと同じ色を使う
  • 明るい:暗い文字色とともに明るい背景を表示する。
  • Dark:暗い背景でフォントを明るい色で表示する。
  • カスタマイズ: X(Twitter)のフィードの色を手動で選択する
ツイッターフィードの配色オプション

X(Twitter)のスライドショーの配色を選んだら、「保存」をクリックして変更を確定してください。

ご覧の通り、ライブフィードエディタを使えば、X(Twitter)のフィードの残りの部分をカスタマイズするのはとっても簡単です。

いくつかのボタンをクリックするだけで、あなたのフィードが思い通りに表示されます。つまり、わかりにくいコードに悩まされたり、開発者を雇ったりする必要がないのです。

X(Twitter)のフィードの見た目に満足したら、「保存」ボタンを クリックしてください。

ステップ 6:X(Twitter)のスライドショーフィードを WordPress に表示する

これで、X(Twitter)のスライドショーフィードを作成・カスタマイズする方法がわかりましたね。素晴らしい! 最後のステップは、それをウェブサイトに表示する方法を学ぶことです。

「X (Twitter) Feed Pro」では、これを行う方法が2つあります:

  • WordPressのページにX(Twitter)のスライドショーフィードを追加する
  • X(Twitter)のスライドショーフィードを、サイドバーやフッターにウィジェットとして追加してください。

どっちがいいかわからない?ご心配なく。下記で両方の方法をチェックできます:

WordPressのページにX(Twitter)のスライドショーフィードを追加する

手軽に設定するには、ライブフィードエディタを使って、わずか数回のクリックでX(Twitter)のスライドショーを埋め込むことができます。

まず、上部の埋め込み ボタンをクリックしてください。

埋め込みライブ・フィード・エディター twitterをクリック

その後、X(Twitter)のフィードをどこに埋め込むかを確認するポップアップが表示されます。

WordPressのページでX(Twitter)のスライドショーを表示する場合は、「ページに追加」ボタンを クリックしてください。

ページに追加する

その後、ポップアップがあなたのサイトのWordPressページのリストを表示します。このリストからページを選択し、「追加 」をクリックしてフィードの埋め込みを開始します。

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

X(Twitter)Feed Pro によって、そのページが WordPress エディタで開かれるようになりました。プラス(+)アイコンをクリックすると、新しい WordPress ブロックを追加できるようになりました。

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

次に、検索ボックスに「twitter feed」と入力し、検索結果から「X (Twitter) Feed」ブロックをクリックします。

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

最後に、「公開」または「更新 」をクリックして変更を保存すると 、X(Twitter)のスライドショーがついに公開されます。

これでウェブサイトを開いて、どのように見えるかを確認できる。

ウェブサイト上の横型ツイッターフィードの例

ご覧のとおり、「X (Twitter) Feed Pro」を使えば、X (Twitter) のコンテンツを簡単に埋め込むことができます。

それでは、サイトにX(Twitter)のスライドショーフィードを表示する2つ目の方法を見ていきましょう。

サイトのサイドバーやフッターにX(Twitter)のスライドショーフィードを追加する

X(Twitter)のスライドショーフィードをウェブサイトのサイドバーやフッターに埋め込むには、ライブフィードエディタを使用するだけで簡単に行えます。

まず、管理ダッシュボードから「X(Twitter)フィード」»「すべてのフィード」メニューに移動し、X(Twitter)のスライドショーフィードをクリックしてください。

オープン・ハッシュタグ

これで再びライブフィードエディターが表示される。

このX(Twitter)フィードを埋め込むには、右上隅にある「埋め込み」ボタンを クリックしてください。

埋め込みライブ・フィード・エディター twitterをクリック

ポップアップを使用すると、新しいX(Twitter)のスライドショーフィードの表示場所を選択できるようになりました。

ウィジェットエリアに埋め込むので、ウィジェットに追加 ボタンをクリックします。

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

X(Twitter)フィード Pro では、X(Twitter)フィードをウィジェットとして埋め込めるよう、ウェブサイトの「ウィジェット」ページへ遷移するようになりました。

X(Twitter)のスライドショーをサイドバーに表示したい場合は、「サイドバー」パネル をクリックしてください。

サイドバーパネルを開く

フッターにX(Twitter)のスライドショーウィジェットを埋め込むには、代わりに「フッター」パネル をクリックしてください。

このガイドでは、WordPressのフッターにフィードを埋め込みます。

フッターパネルを開く

新しいウィジェットを作成するには、下部にあるプラスアイコン(+)をクリックします。

次に、オプションから「X(Twitter)フィード」ウィジェット をクリックして、X(Twitter)のスライドショーフィードを埋め込んでください。

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

最後に、「更新」ボタンを クリックして新しいX(Twitter)ウィジェットを保存すれば、準備完了です!

ウェブサイトを開くと、サイドバーやフッター部分に、次のようなX(Twitter)のスライドショーフィードが表示されるようになりました:

フッターにTwitterフィードを埋め込む例

これで完成だ。

このステップバイステップガイドを読み進めることで、WordPressサイトにX(Twitter)のスライドショーフィードを追加する方法を習得できたはずです。

これで、X(Twitter)のフォロワー数を簡単に増やし、活発なコミュニティを築き、時間をかけてビジネスを成長させることができます。

X(Twitter)のスライドショーを埋め込む準備はできましたか?今すぐ「X(Twitter)Feed Pro」を使い始めましょう!

関連記事として、今すぐビジネスの成長につながることが実証されている「X」投稿のベストな種類について解説したこちらの記事もぜひご覧ください。

この記事が気に入っていただけたなら、X(Twitter)やFacebookで私たちをフォローして、さらに役立つチュートリアルをチェックしてください。

著者アバター
リアン・ラロヤ コンテンツマーケティングマネージャー
リアンヌはスマッシュバルーンでコンテンツマーケティングマネージャーを務め、WordPressコンテンツ、ソーシャルメディアマーケティング、ユーザー生成コンテンツ(UGC)、検索エンジン最適化(SEO)において12年以上の経験を持つ。

コメントを追加する

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