ウェブサイトにツイート/Xの投稿を埋め込む方法(初心者向け)
ホーム ブログ ウェブサイトにツイート/Xの投稿を埋め込む方法(初心者向け)

ウェブサイトにツイート/Xの投稿を埋め込む方法(初心者向け)

ウェブサイトにツイートを埋め込む方法

WordPress ウェブサイトにツイートを埋め込むことを考えていますが、どこから始めればよいかわかりませんか?

ツイートやXの投稿を埋め込むことで、実際の会話を紹介したり、お客様の声を共有したり、サイトのコンテンツを新鮮で魅力的なものに保つことができます。

また、X(Twitter)で視聴者とつながり、フォロワーを増やす効果的な方法でもあります。

初めて自分のサイトにツイートを追加しようとした時、Xの標準埋め込みツールは分かりにくいと感じました。特に始めたばかりの人にとっては。

Smash Balloon では、数百万の WordPress ユーザーがソーシャル メディア フィードをシームレスに表示できるようにして、誰でも簡単に自分の Web サイトに Twitter コンテンツを追加できるようにしました。

この記事では、サイトにツイートを埋め込むための初心者向けの手順を説明します。

何よりも素晴らしいのは、技術に詳しくなくても、ほんの数ステップでウェブサイトにツイートを埋め込む方法を学べることです。

この記事で

ウェブサイトにツイートを埋め込む理由

X(旧Twitter)は、現存する最大のソーシャルメディアプラットフォームの一つであり、ビジネスを宣伝したいブランドにとって人気の場となっています。

Xのユーザー数は2億3700万人を超え、そこにはあなたのビジネスにとって膨大な潜在顧客が存在します。

しかし、すでに多くのマーケターが毎日Xを利用しているため、独自のフォロワーを増やすのは難しいかもしれません。

解決策は?Xのソーシャルメディアコンテンツをウェブサイトに追加し、サイト訪問者を交流やフォロワーへと変えることができます。

ソーシャルメディアにおける存在感を高めるだけでなく、ツイートを埋め込むことがあなたのブランドに役立つ方法をいくつかご紹介しましょう:

このように、Twitterで簡単にフォロワーを増やし、より多くの顧客を獲得し、売上を伸ばし、ブランドを成長させ、お金を稼ぐことができます。

それでは、Twitterをウェブサイトに統合する方法をご紹介しましょう。

WordPressウェブサイトにツイートを埋め込む2つの方法

WordPressのウェブサイトにツイートを埋め込むには、2つの方法があります:

  • 手動で: ツイート用のTwitter埋め込みコードを生成し、そのコードを微調整してから、ウェブサイトに手動で挿入する。
  • 自動で:Twitterのコンテンツを自動的に埋め込んでくれるWordPressプラグインを利用する。

最初の方法を選ぶと、多くの複雑なHTMLコードを扱うことになります。さらに、手動でTwitterフィードを埋め込むには、より多くの時間がかかります。

また、サイトにコードを挿入している間に何か問題が発生しても、サポートチームが助けてくれることはない。

結局のところ、手作業は多くのユーザーにとって困難である。

ウェブサイトにツイートを埋め込む最も簡単な方法は何ですか?

一方、自動オプションを選択すれば、Twitterフィードプラグインを使用するだけで、すべてのツイートを簡単に埋め込めます。コーディングは不要です。

そして、あなたが利用できる最高のTwitterフィードプラグインはSmash Balloon Twitter Feed Proです。

スマッシュバルーン ツイッターフィード プロ ホームページ

このプラグインには、シンプルな3ステップのガイドフローが付属しており、Twitterコンテンツのフィードの作成、カスタマイズ、ウェブサイトへの埋め込みまでの全プロセスを行うことができます。

さらに、埋め込みたいTwitterコンテンツの種類に関しては、たくさんのオプションがある。

特定のプロフィールのツイートを表示したり、Twitterの検索結果を表示したり、選択したTwitterのハッシュタグを表示したり、Twitterのメンションを埋め込んだり、リツイートを表示したり、他にもいろいろできます。

テキスト投稿や写真に加え、このプラグインを使えばウェブサイトにTwitter動画を埋め込むことができ、訪問者をより長く惹きつけることができる。

Twitter Feed Proでは、ツイートがウェブサイトにどのように表示されるかを完全にコントロールすることもできます。

美しいテンプレートをインポートし、ライブフィードカスタマイザーを使って数回クリックするだけでTwitterフィードのデザインを変更できます。

ツイッター用ライブフィードエディタ

ご覧の通り、Twitter Feed Proは、ウェブサイトにツイートを簡単に追加したい場合に最適な選択肢です。このTwitterプラグインを使えば、 Diviウェブサイトにツイートを埋め込むことができるのも気に入っています。

これらの素晴らしい機能により、このプラグインは15万人以上の アクティブユーザーから4.9/5つ星の評価を得ている!

ユーザーレビュー カスタムツイッターフィードプロ

それでは、このプラグインを使用して、数回のクリックで Twitter のコンテンツを Web サイトに埋め込む方法を見てみましょう。

技術に詳しくなくても、ツイートをウェブサイトに追加する準備はできていますか?

今すぐ Twitter Feed Pro を始めましょう!

ウェブサイトにツイートを埋め込む方法(簡単な方法)

あなたのウェブサイトに簡単にツイートを埋め込むには、以下のステップバイステップの指示に従うだけです。

ステップ1: Smash Balloon Twitter Feed Pro をインストールして有効化する

まず、こちらからTwitter Feed Proプラグインを入手してください。次に、あなたのウェブサイトにプラグインをインストールし、有効化するだけです。

もし方法がわからない場合は、WordPressプラグインのインストール方法に関するステップバイステップのガイドをご覧ください。

これでステップ2に進み、Twitterフィードを作成するためにプラグインを使い始めることができる。

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

Twitterフィードを使えば、ウェブサイト上で簡単にツイートを表示できる。

フィードを作成するには、管理画面のダッシュボードエリアからTwitter Feed " All Feeds メニューに移動し、Add Newをクリックします。

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

Twitter Feed Proを使って、ウェブサイトに表示するTwitterフィードの種類を選択できます。6つのオプションから選択できます:

  • ユーザーのタイムラインTwitterアカウントを選択し、そのユーザーによるツイートを表示します。
  • ハッシュタグ選択したTwitterのハッシュタグを持つすべてのツイートを表示します。
  • ホームタイムライン 自分のTwitterタイムラインのツイートを表示する
  • 検索:検索用語を選択し、その用語を含むツイートを埋め込む
  • メンションあなたのTwitterアカウントに言及したツイートを埋め込む
  • リスト: 特定のX(Twitter)リストをサイトに埋め込む

複数の種類のTwitterフィードを使いたいですか?ここで複数のオプションを選択し、フィードタイプを組み合わせることができます。

Twitterフィードの種類を選んだら、Nextを クリックして次に進む。

ハッシュタグツイッターフィード

ウェブサイト上のTwitterフィードの例を示すときには、ハッシュタグフィードタイプを 使用します。

Twitterフィードを作成したら、ステップ3でこのフィードをTwitterに接続しましょう。

ステップ3:Twitterアカウントに接続する

Twitterアカウントと接続することで、新しいフィードはTwitterのコンテンツを取得し、あなたのサイトに表示することができます。

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

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

そうするとTwitterのウェブサイトが開き、プラグインがあなたのアカウントへの読み取り専用 アクセスを要求します。

Twitter Feed Proは、Twitter上のコンテンツを表示するためにこのアクセスを使用し、あなたのアカウントに変更を加えることはありません.ですから、このプラグインは安全に使用できます

続行するには、こちらのAuthorize app ボタンをクリックしてください。

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

その後、Twitter Feed Proがあなたのウェブサイトに戻るので、Twitterフィードのソースを追加してください。

このソースは、フィードの種類に応じて、Twitterプロフィール、ハッシュタグ、検索語、Twitterリストなどになります。

ポップアップにソースを入力し、「Next」をクリックするだけです。

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

ハッシュタグツイッターフィードを作成するので、ここではハッシュタグ "KEEB_PD "をソースとして使用します。

これで次のステップに進み、ツイートがウェブサイトにどのように表示されるかをカスタマイズできる。

ステップ4:ツイートをカスタマイズする

Twitterフィードを簡単にカスタマイズするには、ワンクリックでインポートできるフィードテンプレートを選択します。

ユニークなデザインの7つのフィードテンプレートから選ぶことができます:

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

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

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

ライブフィードカスタマイザーを使えば、数回クリックするだけでTwitterフィードのデザインを変更できます。

左側のオプションを使って、フィードレイアウト、ヘッダーデザイン、ライトボックスオプション、カラースキームなどを選択できます。

また、右側にはTwitterフィードのライブプレビューが表示され、変更を追跡するのに役立ちます。

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

ツイートをカスタマイズする準備はできていますか?

左側のフィードレイアウトオプションを 探し、それをクリックしてカスタマイズを開始する。

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

ここでは、さまざまなフィード・レイアウトから選択し、WordPressサイトでのツイートの表示方法をコントロールすることができます。

ここには、リスト、カルーセル、メイソンの3つのレイアウトがある。

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

リストレイアウトを 使うと、ツイートはツイッター公式サイトのように1列に表示されます。

おまけに、この方法ならあなたのツイートがより目につきやすくなる。

リストレイアウト・ツイッターフィード・プロ

次に、さまざまな柱を使ってツイートを表示する石積みの レイアウトを選ぶことができる。

その結果、一度に大量のツイートをサイトに埋め込むことができる。

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

最後に、カルーセルレイアウトがあります。これは、ツイートをTwitter カルーセルまたはスライダーに変換します。

そうすれば、ウェブサイトをより魅力的でインタラクティブなものにすることができる。

カルーセルレイアウト

フィードレイアウトオプションを選択したら、上部の保存 ボタンをクリックします。

そうしたら、カスタマイズ・ ボタンをクリックして、メインのカスタマイズ・オプションに戻ってください。

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

ここから、Twitterフィードのデザインを変更し続けることができます。

ツイートの色を編集するには、左側の配色 オプションをクリックします。

配色を選ぶ twitterフィード

ここでは、あなたのツイートに選択できる4つの配色を見ることができます:

  • テーマからの継承: WordPressテーマと同じ色を使用する
  • 明るい:明るい背景と暗い文字色を表示
  • 暗い:暗い背景とともに明るい文字色を選択する。
  • カスタム: すべての色を手動で選ぶ
ツイッターフィードの配色オプション

このリストから好みの配色を選び、「保存」をクリックします。

残りのカスタマイズオプションを使って、ツイートのデザインを選択できます。ヘッダースタイル、ボタンのデザイン、ツイート数の制限、フィードサイズなどを設定できます。

最後に、Twitterフィードのデザインに満足したら、保存ボタンをクリックしてください。

その後、最後のステップに進み、これらのツイートをウェブサイトに追加する。

ステップ5:ウェブサイトにツイートを埋め込む

Twitter Feed Proを使うと、ツイートをウェブサイトに埋め込む方法が2つあります:

  • ウェブページにツイートを埋め込む
  • ウェブサイトのサイドバーやフッターにツイートを埋め込む

ウェブページにツイートを埋め込む

ライブフィードエディタを使えば、数回クリックするだけで、ツイートを埋め込むことができます。

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

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

次に、Twitterフィードを埋め込むためのすべてのオプションを含むポップアップが表示されます。

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

ページに追加する

ポップアップには、ウェブサイトにあるすべてのWordPressページのリストが表示されます。

ツイートを表示したいページを選択し、「追加」をクリックするだけです。

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

そうすると、WordPressのエディターでページが開きます。

そこからプラスアイコン(+)をクリックして、新しいコンテンツブロックを追加することができます。

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

ここで、上部の検索バーを使って「twitter feed」ブロックを探す。

最後に、下のTwitterフィードブロックをクリックして、ツイートを埋め込んでください。

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

変更内容を確認するには、上部にある「更新」ボタンをクリックすれば完了です!

あなたのウェブサイトを開いてみてください。

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

次に、ツイートをウェブサイトに埋め込む方法を紹介しよう。

ページにツイートを追加するだけでなく、サイドバーやフッターにTwitterウィジェットとしてツイートを表示することもできます。

以前と同じように、ライブフィードエディタを使ってツイートを埋め込むことができる。

ライブフィードエディターでTwitterフィードをもう一度開くには、WordPressダッシュボードからTwitterフィード " すべてのフィード メニューに移動します。

次に、埋め込みたいTwitterフィードをクリックします。

オープン・ハッシュタグ

ライブフィードエディターであなたのツイートを再び見ることができます。

続けるには、上部にある埋め込み ボタンをクリックする。

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

ポップアップで、ツイートを埋め込む場所を選択できます。

今回は、「ウィジェットに追加 」ボタンをクリックして続行する。

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

そうすると、WordPressサイトのウィジェットページが開き、新しいTwitterウィジェットを埋め込むことができます。

サイドバーにツイートを追加するには、サイドバーパネルを クリックします。

サイドバーパネルを開く

フッターにツイートを表示したい場合は、フッターパネルを クリックしてください。

このTwitterフィードの例では、WordPressのサイドバーを使うことにしよう。

フッターパネルを開く

サイドバーまたはフッターに新しいウィジェットを追加するには、下部にあるプラスアイコン(+)を クリックしてください。

次に、Twitter Feedをクリックして、新しいTwitterフィードを埋め込みます。

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

最後に「更新」ボタンをクリックして、新しいTwitterフィード・ウィジェットを確認して完了です。

あなたのウェブサイトを開くと、ウィジェットエリアにあなたのツイートが表示されます。

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

そうだ!

あなたのウェブサイトにツイートを簡単に埋め込む方法はお分かりいただけたと思います。これで、簡単にTwitterのフォロワーを増やし、訪問者の関心を引き、売上を伸ばすことができます。

一番の利点は?Twitter Feed Proプラグインを使えば、たった数回のクリックでそのすべてを行うことができます。

ツイートの埋め込みを始めたいですか?Twitter Feed Proはこちらから

Twitterのエンゲージメントを高めるベストな方法のリストもご覧ください。

この記事がお役に立ちましたら、X(Twitter)Facebookでフォローし、ソーシャルメディアマーケティングのコツやテクニックを今後もご期待ください。

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

コメントを追加する

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