要約：WordPressにTwitter(X)ウィジェットを追加する方法
WordPressサイトにTwitterウィジェットを追加するには3つの方法があります。それぞれ、制御と労力のレベルが異なります。
- SeedProd（方法1）：ドラッグ＆ドロップのTwitterブロックを使用して、ツイートの埋め込み、フォローボタン、またはツイートボタンをサイトのどこにでも配置します。
- Smash Balloonプラグイン（方法2）：レイアウトテンプレート、色のカスタマイズ、およびキャッシュが組み込まれた完全なライブTwitterフィードを表示します。
- 手動埋め込み（方法3）：Twitter Publishからコードをコピーし、カスタムHTMLブロックまたはウィジェット領域に貼り付けます。プラグインは不要です。
- サイドバーに最適：3つの方法すべてでサイドバーの配置が可能です。基本的なサイドバーフィードの場合は、Smash Balloonと手動の方法が最も迅速です。
- 費用：SeedProdとSmash Balloonは、高度な機能には有料プランが必要です。手動埋め込み方法は完全に無料です。
訪問者は、あなたのプロフィールをフォローすることなく、サイトを閲覧して離れていきます。彼らを繋ぎ止めることができるTwitterコンテンツはX上にあり、あなたのWordPressサイトは静的なままです。
このガイドでは、WordPressにTwitterウィジェットを追加する3つの方法を説明します。あなたのサイトに合った方法を選び、Xコンテンツをあなたのビジネスのために活用してください。
WordPressにTwitterウィジェットを追加する最も簡単な3つの方法を以下に示します。
- SeedProdを使用する：SeedProdのTwitterブロックを使用して、ツイート、タイムライン、またはフォローボタンをサイトのどこにでも追加します。
- プラグインをインストールする：Custom Twitter Feeds（Smash Balloon）のようなプラグインを使用して、カスタマイズ可能なTwitterフィードを作成します。
- 手動で埋め込む：公式のTwitter Publishツールから埋め込みコードをコピーし、ブロックまたはウィジェット領域に貼り付けます。
このガイドでは、各方法をステップバイステップで説明しますので、サイトに最適なオプションを選択できます。
| 方法 | 最適 | 長所 | 短所 |
|---|---|---|---|
| SeedProd | デザインコントロールを完全に求めている方 | ドラッグ＆ドロップ編集; ツイート、タイムライン、ボタンを追加; テーマに合わせてスタイルを設定 | 高度な機能には有料プランが必要 |
| Twitterフィードプラグイン | 複数のフィードやハッシュタグ表示が必要なビジネス | 既製のレイアウト; リアルタイム更新; スピードのためのフィードキャッシュ | 管理する追加のプラグイン |
| 手動埋め込み | 簡単なワンオフツイートまたはシンプルなタイムライン | プラグイン不要; 簡単なコピー＆ペースト設定; 完全無料 | 限定的なスタイリング; 手動配置のみ |
WordPress Twitterウィジェットとは？
Twitterウィジェットとは、単一の埋め込みツイートから完全なライブタイムライン、フォローボタン、またはツイートボタンまで、Twitter/Xコンテンツを表示するサイト上のあらゆるブロックのことです。Twitterフィードプラグインは、特に自動的に更新される動的な複数ツイートタイムラインを表示するためのものです。どちらも「Twitterウィジェット」の傘下に入りますが、異なるものです。
WordPress Twitterウィジェット（またはXウィジェット）は、サイトのサイドバー、フッター、またはページレイアウトに追加できる小さなコンテンツブロックです。タイムライン、単一のツイート、またはフォローボタンなど、Twitter/Xからのライブコンテンツを表示します。
このようなウィジェットは、コードを書かずにサイトを最新の状態に保ちます。接続すると、新しいツイートが公開されるたびに自動的に更新されます。
- 完全なTwitter/Xフィード（タイムライン）を埋め込む
- 単一のツイートを表示する
- ハッシュタグまたはリストからのツイートを表示する
- フォローまたはツイートボタンを追加する
WordPressにTwitterウィジェットを追加するには、SeedProd、Twitterフィードプラグイン、またはTwitter Publishツールから埋め込みコードを貼り付ける方法があります。
WordPressにTwitterコンテンツを追加する理由
Twitter/Xフィードはサイトを自動的に更新します。物事を最新の状態に保つために、手動でログインしてコンテンツを追加する必要はありません。
- 手動更新なしでコンテンツを最新の状態に保つ：投稿するたびに最新のツイートがサイトに表示され、追加の作業は不要です。
- 訪問者がサイトを離れることなくフォローできるようにする：フォローボタンまたは埋め込みフィードにより、サイトを離れることなくアカウントに接続できます。
- 表示されるエンゲージメントによるソーシャルプルーフを示す：サイトに表示されるフォロワー数とツイートのインタラクションは、新しい訪問者との信頼を築きます。
フォローボタンや共有ボタンが含まれるTwitterウィジェットは、ソーシャルメディアのフォロワーを増やすのに役立ちます。ユーザーはサイトを離れてTwitterアカウントを表示する代わりに、Twitterであなたをフォローしたり、関連コンテンツをサイトから直接共有したりできます。
1. SeedProdを使用してTwitterウィジェットを追加する
まず、SeedProd を使用して WordPress に Twitter ウィジェットを追加する方法を見てみましょう。
SeedProd は、ドラッグ＆ドロップのウェブサイトビルダーであり、コードに触れることなく、サイトのどこにでもツイートの埋め込み、フォローボタン、ツイートボタンなどの Twitter ブロックを追加できます。Twitter ブロックは SeedProd の有料プランで利用できます。
SeedProdを使用してWordPressにTwitterウィジェットを追加するには、次の手順に従ってください。
ステップ1. SeedProdのインストールと有効化
まず、SeedProd プランを開始し、プラグインをコンピューターにダウンロードする必要があります。その後、プラグインを WordPress ウェブサイトにアップロードして有効化します。
この手順でヘルプが必要な場合は、WordPress プラグインのインストールに関するこのガイドを参照してください。
注意: SeedProd には無料ライセンスがありますが、高度な Twitter ブロック機能にはプレミアムバージョンを使用します。
SeedProd をインストールしたら、SeedProd » 設定に移動し、ライセンスキーを入力します。キーは SeedProd ウェブサイトの「ダウンロード」セクションのアカウントで見つけることができます。
ステップ2. WordPressテーマまたはランディングページの作成
SeedProdを使用してWordPressサイトをカスタマイズするには、2つの方法があります。
すべてのテンプレートパーツとページを含むカスタム WordPress テーマを構築することも、既存のWordPress テーマでランディングページを構築することもできます。
このチュートリアルでは、カスタム SeedProd WordPress テーマのサイドバーテンプレートを使用します。SeedProd は、サイドバー、ヘッダー、フッター、または個々のページテンプレートを含む任意のテンプレートパーツに Twitter ブロックを追加できます。SeedProd を使用してカスタム WordPress テーマを作成するためのすべての手順については、このガイドを参照してください。
ランディングページを使用したい場合は、WordPress でランディングページを作成する方法に関するこのガイドに従ってください。
どちらの記事も、テンプレートの選択からテーマまたはランディングページのカスタマイズ準備までの手順を説明しています。Twitterコンテンツを追加する準備ができたら、このチュートリアルのステップ3に進んでください。
ステップ3. SeedProd TwitterブロックをWordPressに追加する
カスタムテーマまたはランディングページを作成したら、SeedProd のビジュアルエディターでデザインを編集できます。
ランディングページを編集している場合は、SeedProd » ランディングページに移動し、カスタマイズしたいページで「編集」をクリックします。
このガイドでは、カスタム WordPress テーマのサイドバーテンプレートを編集します。これを行うには、SeedProd » テーマビルダーに移動し、関連するテンプレートにカーソルを合わせて、「デザインを編集」リンクをクリックします。
デザインを開くと、SeedProdのビジュアルエディターに表示されます。ブロックとセクションは左側に、ライブプレビューは右側にあります。
プレビューの任意の要素をクリックして設定を編集できます。これにより、左側のパネルにカスタマイズオプションが開きます。
Advanced ブロックセクションまでスクロールダウンすると、デザインに追加できるさまざまなコンテンツ要素が表示されます。WordPressサイトにTwitterウィジェットを追加するために焦点を当てるブロックは次のとおりです。
- Twitterツイートを埋め込む
- Twitterツイートボタン
- Twitterフォローボタン
Twitterツイートを埋め込む
Twitter 埋め込みツイートブロックを使用すると、数回クリックするだけで任意の Twitter 投稿を埋め込むことができます。ブロックをライブプレビューにドラッグし、クリックして設定を表示します。
設定パネルでは、埋め込みたい特定のツイートのIDを貼り付けることができます。また、ライトとダークの配色を選択したり、ツイートの会話を非表示にしたり、写真、動画、Twitterカードを非表示にしたり、ブロックの配置を調整したりすることもできます。
Advanced タブは、ブロックのスペーシングと属性を制御し、モバイルまたはデスクトップで非表示にすることができます。
Twitter TweetおよびFollow Buttonブロック
SeedProd の最後の 2 つの Twitter ウィジェットは、ツイートボタンとフォローボタンブロックです。これらは投稿やフィードの埋め込みと同様に機能しますが、Twitter コンテンツを表示する代わりに、訪問者がカスタムメッセージをツイートしたり、Twitter でプロフィールをフォローしたりできるようにします。
フォローボタンの設定では、Twitterのスクリーンネームを入力し、フォロワー数を表示し、配置、言語、スペーシング、デバイスの表示をカスタマイズできます。
Tweetボタンの設定では、訪問者に共有してほしいURL、ツイートコンテンツ、ハッシュタグを追加できます。また、@メンションや関連アカウントを追加するフィールドもあります。
どちらのボタンも、小または大のボタンサイズから選択でき、モバイルおよびデスクトップ画面にどのように表示されるかを制御できます。
注意: Xはタイムライン埋め込み機能を静かに非推奨にしたため、SeedProdではTwitter Embed Timelineブロックは利用できなくなりました。
SeedProd の Twitter ブロックのさまざまな組み合わせを試してから、右上隅の保存ボタンをクリックして変更を保存します。
ステップ4. WordPressでTwitterウィジェットを公開する
次のステップは、Twitter コンテンツを WordPress サイトで公開することです。カスタム SeedProd WordPress テーマを使用しているため、行う必要があるのは、SeedProd » テーマビルダーに移動し、SeedProd テーマを有効にするトグルを「オン」の位置にすることだけです。
これで、Twitterコンテンツを含むページのプレビューを表示し、その外観を確認できます。SeedProdのビジュアルエディターを使用すると、Twitterフォローボタンをメールサインアップフォームの横に配置できるため、訪問者は好みの方法で接続を維持できます。
2. WordPress Twitter FeedプラグインでTwitterウィジェットを埋め込む
Xは2023年にAPI価格を変更し、多くの無料Twitterプラグインが動作しなくなりました。Smash Balloonはこれらの変更を通じてAPI接続を維持しましたが、無料または放棄された一部のプラグインは動作を停止しました。現在使用しているTwitterプラグインが2023年以降動作しなくなった場合、おそらくその理由がこれです。
この方法では、Smash BalloonのCustom Twitter Feeds Proプラグインを使用します。Custom Twitter Feedsの無料バージョンは基本的なフィードを表示しますが、Proバージョンはレイアウトテンプレートと分析機能を追加します。
Custom Twitter Feedsプラグインは、WordPress向けのトップ評価のTwitterフィードプラグインです。数回のクリックで、ウェブサイトにTwitterフィードを表示するために使用できます。
ビジュアルフィードエディターを使用して、ライブTwitterフィードをリアルタイムでカスタマイズし、ビジネスニーズに合わせて複数のフィードタイプから選択できます。
Smash Balloonを使用してWordPressにTwitterフィードを追加するには、以下の手順に従ってください。
ステップ1：Twitter Feeds Proプラグインのインストール
まず、Twitter Feeds Proプラグインを入手し、WordPressサイトにインストールしてください。
プラグインをアクティブ化した後、Twitter Feed » Settingsに移動し、ライセンスキーの詳細を入力してください。
ライセンスキーを確認したら、最初のTwitterウィジェットを追加する準備が整いました。
ステップ2：カスタムTwitterウィジェットの作成
新しいTwitterウィジェットを追加するには、Twitter Feed » All Feedsページに移動し、Add Newボタンをクリックします。
次のページで、追加したいフィードの種類を選択できます。以下のオプションが表示されます：
- ユーザータイムライン: Twitter上の任意のユーザーのツイートのタイムライン
- ハッシュタグ: 特定のハッシュタグを含む公開ツイート
- ホームタイムライン: Twitterアカウントのタイムライン
- 検索: 特定のTwitter検索用語に一致するツイートのフィード
- メンション: Twitterハンドルに言及しているツイート
- リスト: 公開Twitterリストからのツイート
このガイドでは、ユーザータイムラインオプションを選択します。次のステップに進む準備ができたら、Nextボタンをクリックしてください。
ステップ3：Twitterアカウントの接続
次の画面で、Twitterからデータを取得してウェブサイトに表示できるように、読み取り専用アクセス用にTwitterアカウントを接続するように求められます。
Connectボタンをクリックした後、Authorize Appを選択すると、Twitterフィード作成プロセスに戻ります。
ユーザータイムラインフィードを追加するため、次のステップは表示したいTwitterハンドルを入力することです。ユーザー名を入力し、Nextボタンをクリックします。
ステップ4：Twitterウィジェットのカスタマイズ
これで、Twitterウィジェットの7つの異なるテンプレートから選択できます：
- デフォルトフィード
- メーソンリーカード
- シンプルなカルーセル
- シンプルなカード
- ショーケースカルーセル
- 最新ツイート
- ウィジェット
ウェブサイトに最適なテンプレートをクリックし、Nextボタンをクリックします。
次の画面では、ライブエディターを使用してTwitterウィジェットをカスタマイズできます。
左側のパネルには、フィードレイアウト、配色、ヘッダーデザイン、ツイート、ライトボックスオプションなどを変更するためのオプションがあります。右側で変更をプレビューすることもできます。
フィードレイアウトタブでは、リスト、マソンリー、またはカルーセルレイアウトから選択できます。
Color Schemeタブで、ダーク、ライト、またはカスタムカラーを選択できます。WordPressテーマから配色を継承するオプションもあり、フィードをサイトのデザインに合わせる最も簡単な方法です。さらにカスタマイズしたい場合は、カスタムCSSも利用できます。
ヘッダータブでは、標準やテキストなど、いくつかのヘッダーカスタマイズオプションが用意されています。ヘッダーセクションを無効にして、Twitterのプロフィールを非表示にすることもできます。
すべてが満足のいく外観になるまで、ウィジェットの外観の調整を続けます。Saveボタンをクリックして設定を保存します。
ステップ5. TwitterウィジェットをWordPressに追加する
Smash Balloonを使用すると、WordPressサイトにTwitterウィジェットを埋め込むのは簡単です。画面上部にあるEmbedボタンをクリックします。
ポップアップが表示され、次の埋め込みオプションが表示されます。
- ショートコード：Twitterフィードのショートコードを任意のページ、投稿、またはウィジェットに貼り付けます
- WordPressブロック: WordPressに組み込まれたブロックを使用して、投稿、ページ、またはウィジェットにフィードを追加します。
このガイドでは、Add to a Widgetオプションを選択します。
そのオプションをクリックすると、WordPressウィジェット設定が自動的に開きます。そこから、追加ブロックアイコンをクリックし、カスタムTwitterフィードブロックを探します。
ブロックをウィジェットエリアに追加した後、Updateボタンをクリックして変更を保存します。次にサイトにアクセスして、Twitterウィジェットが動作していることを確認してください。
3. WordPressにTwitterウィジェットを手動で追加する
この方法は完全に無料で、プラグインは必要ありません。Twitter Publishツールを使用して、WordPressに直接貼り付ける埋め込みコードを生成します。
最後の方法は、Twitter Publishツールを使用して、プラグインなしでTwitterウィジェットをWordPressサイトに手動で追加することです。このオプションでは、ツイート、タイムライン、またはフォローボタンを埋め込むことができます。
この方法では、ウィジェットのデザインや表示できるコンテンツの種類をあまり制御できません。追加のプラグインなしで簡単に埋め込みたいユーザーに適したオプションです。
この方法を使用するには、Twitter Publishツールウェブサイトにアクセスし、使用したい埋め込みの種類を選択します。このガイドでは、埋め込みタイムラインオプションを使用します。
次の画面で、表示したいTwitterプロフィールの完全なURLを入力し、プレビューボタンをクリックする必要があります。
Twitterは、ウェブサイトに埋め込むことができるタイムラインのショートコードを生成します。コピーボタンをクリックしてコードをクリップボードに保存し、WordPressサイトに戻ります。
埋め込みコードは、WordPressの投稿、ページ、またはウィジェット領域に追加できます。タイムラインをサイドバーウィジェットとして埋め込むには、WordPressダッシュボードから外観 » ウィジェットに移動します。
次に、追加アイコンをクリックしてサイドバーに新しいブロックを追加し、カスタムHTMLブロックを探します。Twitterからコピーした埋め込みコードをHTMLブロックに貼り付け、更新ボタンをクリックします。
ライブウェブサイトにアクセスすると、Twitterウィジェットはこの例のように表示されます。
WordPressにTwitterウィジェットを表示する場所
ウィジェットが設定されたら、配置が重要です。最も効果的な3つの場所を次に示します。
- サイドバー：すべてのページで常に表示するのに適しています。訪問者は、読んでいる投稿やページに関係なく、Twitterコンテンツを確認できます。
- ホームページのヒーローセクションまたはフッター：最もトラフィックの多いページでのソーシャルプルーフに適しています。フッターのフォロー数が多いと、初めて訪問したユーザーの信頼が高まります。
- 特定の投稿またはランディングページ：トピックに関連するコンテンツに適しています。あなたが書いているトピックについて頻繁にツイートする場合、それらの投稿にフィードを埋め込むことで、あなたの権威を強化します。
WordPressでTwitterウィジェットが表示されないのはなぜですか？
TwitterウィジェットのWordPress表示が空白になったり、更新が停止したりする場合、通常は次の3つの原因のいずれかが考えられます。
- キャッシュがフィードをブロックしている：ウィジェットを埋め込んだ後または更新した後に、キャッシュプラグインをクリアしてください。W3 Total CacheやWP Rocketのようなプラグインは、サイドバーの古いバージョンを提供してウィジェットを非表示にすることがあります。
- 非推奨の埋め込みまたは古いプラグイン：Twitter Publishの埋め込みタイムラインは引き続き機能しますが、現在の埋め込みコードについてはpublish.twitter.comを確認してください。2022年以降更新されていないプラグインを使用している場合、Xの2023年のAPI変更により接続が破損している可能性があります。
- テーマでウィジェット領域がアクティブになっていない：外観 » ウィジェットに移動し、サイドバーウィジェット領域がアクティブであり、サイトに表示されていることを確認してください。一部のテーマでは、特定のページテンプレートでサイドバー領域が無効になっています。
最初からやり直す必要がある場合は、上記の方法1または方法2を参照して、最新の設定手順を確認してください。以前はフィードが機能していましたが、Xのアップデート後に停止した場合は、Smash Balloonが継続的なメンテナンスに最も信頼性の高いオプションです。
WordPressにTwitterウィジェットを追加することに関するFAQ
WordPressのサイドバーにTwitterフィードを無料で追加するにはどうすればよいですか？
無料のオプションは手動埋め込み方法です。publish.twitter.comにアクセスしてタイムラインの埋め込みコードを生成し、WordPressの外観 » ウィジェットに移動して、サイドバーにカスタムHTMLブロックを追加し、コードを貼り付けます。プラグインは不要です。Smash BalloonのカスタムTwitterフィードプラグインの無料バージョンも、基本的な埋め込みではなく、スタイル設定されたフィードが必要な場合のもう1つのオプションです。
WordPressでTwitter（X）ウィジェットが表示されないのはなぜですか？
最も一般的な原因は、キャッシュ、古いプラグイン、非アクティブなウィジェットエリアの3つです。ほとんどの場合これで解決するため、まずキャッシュプラグインをクリアしてください。プラグインが2022年以降更新されていない場合、Xの2023年のAPI変更により破損している可能性があります。
各原因に対する具体的な修正については、上記のトラブルシューティングセクションを参照してください。
プラグインなしでTwitterフィードを埋め込むことはできますか？
はい。publish.twitter.comのTwitter Publishツールを使用して、公開されているタイムライン、プロフィール、またはツイートの埋め込みコードを生成できます。コードをWordPressの投稿、ページ、またはウィジェットエリアのカスタムHTMLブロックに貼り付けます。ただし、スタイリングコントロールがなく、ハッシュタグやメンションでフィルタリングできないという制限があります。
Twitterフィードを埋め込むとWordPressサイトが遅くなりますか？
遅くなる可能性がありますが、ほとんどの優れたTwitterフィードプラグインはキャッシュを使用してこれを処理します。たとえば、Smash Balloonはフィードデータをローカルにキャッシュするため、サーバーはページ読み込みごとにライブAPI呼び出しを行いません。手動埋め込み方法はTwitter独自のスクリプトを直接読み込むため、ページにいくらかの負荷がかかる可能性があります。
速度が優先される場合は、手動埋め込みオプションではなく、組み込みのフィードキャッシュを備えたプラグインを使用してください。
WordPressにツイートを埋め込むにはTwitter APIキーが必要ですか？
ほとんどの方法では不要です。Smash Balloonのようなプラグインは、独自の接続プロセスを通じてAPI認証を処理します。publish.twitter.comからの手動埋め込み方法はAPIキーをまったく必要としません。Twitter/X APIに直接呼び出すカスタムまたは開発者作成のソリューションのみ、独自のAPI認証情報を作成する必要があります。
これで、Twitter/Xコンテンツがサイトに公開されました。設定に合った方法を選択し、必要に応じて他の方法に戻ってください。
SeedProdでWordPressにTwitterウィジェットを追加する準備はできましたか？
こちらも、WordPressにFacebookイベントを埋め込むガイドが役立つかもしれません。
お読みいただきありがとうございます！ご意見をお聞かせいただければ幸いですので、ビジネスを成長させるための役立つアドバイスやコンテンツについては、お気軽にYouTube、X、Facebookで会話にご参加ください。
