ソーシャルウォール 
フィード分析 
昨日はフィードが正常に動作していました。その後、テーマを変更したり、キャッシュプラグインを有効にしたり、ページビルダーを更新したりしたところ、フィード領域が空白になったり、ローディングアイコンが表示されたままになったり、スタイルが適用されていない単一のカラムに投稿本文がそのまま表示されたりしています。
何も失われていません。フィードや設定したすべての項目は、あなたが最後に保存したままの状態で、データベースにそのまま残っています。アカウントも引き続き接続されています。新しい設定のどこかに問題があり、ページ上でフィードが表示されない状態になっています。
これまで、数多くのテーマ切り替えや最適化プラグイン、ビルダーの設定を通じてこのパターンを目にしてきたため、それがどこに潜んでいるか把握しています。ここでは、約2分で完了するテストと、その結果に応じて行う修正方法をご紹介します。
この記事の中で
これは本当にプラグインの競合なのでしょうか？
次の2つの条件がともに当てはまる場合、それは競合です。つまり、特定の変更を行った直後にフィードが機能しなくなり、そのテーマやプラグインを一時的に無効にすると再び機能する、という状況です。どちらか一方の条件が当てはまらない場合は、別の問題であると考えられます。
対立の兆候：
- フィード領域が空白であるか、読み込み中のスピナーが止まらない
- フィードには、スタイルが適用されていない生の投稿テキストが1列に並んで表示されています。これは、CSSが読み込まれていないことを意味します。
- このページでは、お使いのブラウザのコンソールにJavaScriptのエラーが表示されています
- そのタイミングは、テーマの切り替え、プラグインの有効化、またはプラグインの更新と完全に一致しています
「対立ではない」という兆候：
- フィードには投稿の代わりに、接続エラーまたはトークンエラーのメッセージが表示される
- 変更から数日後にフィードが機能しなくなりましたが、サイト上の他の部分には何の変化もありませんでした
もしあなたが後者のグループに該当する場合、原因は通常、テーマそのものではなく、接続環境にあります。Instagramのフィードが表示されない理由に関するガイドでは、その解決策を詳しく解説しています。
テストを行う前に、キャッシュ（ホスト、CDN、ブラウザのキャッシュ）をすべてクリアしてください。単に保存されていた古いページのコピーを表示していただけの場合、これだけで問題が解決することもあります。
もしその後もフィードが正常に機能しない場合は、その時点でサイトが現在どのような状態にあるかが把握できているため、それ以降に行うすべてのテストから実際に何かがわかるはずです。
テーマやプラグインを変更しただけで、それまで正常に動作していたフィードが機能しなくなる理由
フィードがページに表示されるには、3つの要素が必要です。それは、フィードを配置するコンテナ、スタイルを設定するCSS、そしてフィードに動きを与えるJavaScriptです。これら3つの要素は、この順序で読み込まれる必要があります。
テーマによっては、最初のページ読み込み時にページコンテンツを読み込まないものがあります。それらは、少し遅れてAJAXでコンテンツを取得します。そのため、フィードのJavaScriptが実行され、そのコンテナを探しますが、まだ何も見つからないため、何事もなかったかのように停止してしまいます。
最適化プラグインは、反対側からこのハンドシェイクを妨げます。キャッシュや高速化プラグインがフィードのスクリプトを先送り、遅延、結合、または遅延読み込みを行うと、それらのスクリプトは遅れて届いたり、順序が乱れたりします。
コンテナの準備は整っているが、フィードのスクリプトが到着するのが遅すぎて、それに対して処理を行うことができない。
ここで重要な視点の切り替えがあります。フィードが壊れたわけではありません。ハンドシェイクに問題があったのです。そのため、以下の対処法は再構築ではなく、設定の切り替えで済みます。どちらの場合でも、データが失われることはありません。
競合テストを実行する
スイッチを一つも操作する前に、このテストでは以下のことは行われないことをご承知おきください。
- プラグインを無効にしても、その設定は削除されません。すべての設定はデータベースに残っており、再有効化した瞬間に元通りになります。
- テーマを切り替えても、フィードの設定はリセットされません。フィードの設定は、テーマではなくSmash Balloonプラグイン内に保存されています。Twenty Twenty-Fiveに切り替えてから元に戻しても、フィードは以前とまったく同じ状態のままです。
- 投稿、ページ、コンテンツには一切影響がありません。画面に表示される内容のみが変更され、それもテスト中のみです。
実用的な注意点として、トラフィックが少ない時間帯に実行するか、もしあればステージング環境で実行してください。最も混雑する時間帯に実行する理由はありません。
それでは、テストそのものについてです。
- まず、ホスト、CDN、ブラウザのキャッシュをすべてクリアしてください。これにより、保存されたコピーではなく、現在の状態のままサイトをテストできるようになります。
- 「プラグイン」＞「インストール済みプラグイン」に移動し、Smash Balloonプラグイン以外のすべてのプラグインを無効にしてください。フィードページを確認してください。
- フィードが復旧したら、プラグインを1つずつ再有効化し、その都度フィードの状態を確認してください。この作業にかかる時間は、インストールしているプラグインの数によって異なります。フィードの表示を妨げているプラグインが、原因となっているものです。
- 他の設定をすべてオフにしてもフィードが正常に動作しない場合は、「外観」»「テーマ」に移動し、「Twenty Twenty-Five」に切り替えてください。フィードを確認してください。それでも正常に動作しない場合は、「Twenty Twenty-One」を試して、再度確認してください。
- デフォルトのテーマで正常に動作する場合は、お使いのテーマが競合の原因です。その場合は、以下のAJAXの修正方法に進んでください。
- 独自のテーマを復元し、プラグインを再度有効化してください。不具合を再現させた変更点を1つだけメモしておいてください。復元すると不具合が再発するため、独自の設定に戻ったら、以下の関連するセクションに記載されている修正を適用してください。
テストの結果が何であれ、次にどのセクションを読むべきかがわかります。「テーマ」の場合は、以下のAJAX設定を指します。「キャッシュ」や「速度」関連のプラグインの場合は、「除外項目」のセクションを指します。「ページビルダー」の場合は、ページビルダーのチェックを指します。
「AJAXテーマ読み込みの修正」オプションを有効にする
競合チェックの結果、テーマが原因であることが判明した場合、ほとんどの場合、この方法で解決できます。必要なのはチェックボックスを1つオンにするだけです。
Smash Balloon プラグインの「設定」»「詳細設定」に移動し、「AJAX テーマ読み込みの修正」を有効にしてください。
「変更を保存」をクリックし、キャッシュをクリアしてから、ページを再読み込みしてください。
この設定の効果は次のとおりです。テーマの遷移による競合を回避する形でフィードを読み込むため、最初の描画時にスタイルが正しく適用されます。これが、この問題の最も一般的なケースに対する解決策のすべてです。
再構築も、アカウントの再接続も、以前のテーマへの戻しもできません。
この設定はSmash Balloonスイート全体で共通しているため、Instagram、Facebook、Twitter/X、YouTubeのいずれのフィードを運用している場合でも、設定手順は同じです。複数のフィードプラグインをインストールしている場合は、それぞれのプラグインでこの設定を有効にしてください。
フィードは、周囲のサイトに変更があっても機能し続けるように設計されているため、新しいテーマに切り替える際は、設定を1つ変更するだけで済み、フィードを再構築する必要はありません。
最適化プラグインからSmash Balloonを除外する
キャッシュや高速化プラグインを無効にしたところ、フィードが復旧した場合は、このセクションをご覧ください。テストで何も問題が発見されなかった場合でも、このセクションを読む価値はあります。なぜなら、WordPressの外側で行われている最適化の中には、テストでは検出できないものもあるからです。
最適化プラグインは、サイトのファイルの読み込み順序を再編成することで機能します。ほとんどの場合、これによる影響はありません。ただし、特に以下の4つの設定を行うと、フィードのスクリプトの順序が乱れる可能性があります：
- JavaScript や CSS を縮小または結合してください。これにより、フィードのファイルが他のすべてのファイルと統合され、読み込み順序が変わる可能性があります。
- JavaScriptの実行を先送りまたは遅延させる。「ユーザーの操作があるまでJavaScriptの実行を遅延させる」という設定は、ユーザーがスクロールしたりクリックしたりするまでフィードのスクリプトの実行を保留するため、よく使われる設定です。
- 遅延読み込み。フィード内の画像、あるいは場合によってはフィードコンテナ全体に適用され、まったく読み込まれないようにする。
- CDNレベルの最適化。Cloudflare Rocket Loaderは注目すべきサービスです。これはWordPressの外側に位置するため、競合テストの結果には一切表示されません。
たとえ競合チェックで問題が検出されなかったとしても、最後の項目は確認する価値があります。CDNの設定はWordPressの外側にあり、このチェックでは検出できないからです。
ここではっきり言っておきたいのは、キャッシュ機能をオフにする必要はまったくないということです。本格的な最適化プラグインには、すべて「除外リスト」（「無視リスト」と呼ばれることもあります）が用意されています。そこにSmash Balloonを追加すれば、その他の速度設定はそのまま維持できます。
追加するのは、プラグインのディレクトリパスです。具体的なフォルダ名は、無料版プラグインを使用しているか、Pro版を使用しているかによって異なります。Pro版のディレクトリ名は -pro.
どちらをお持ちか分からない場合は、開いてください /wp-content/plugins/ ホストのファイルマネージャーを開き、フィードプラグインのフォルダを探してください。
/wp-content/plugins/instagram-feed/ (free)
/wp-content/plugins/instagram-feed-pro/ (Pro)
お使いのフィードプラグインのディレクトリ名に置き換えてください。パスは、プラグインの更新後も引き続き機能するため、追加する上で最も安全な方法です。
3つのリストすべてに個別に追加してください。具体的には、JavaScriptまたはミニファイの除外リスト、JavaScriptの遅延読み込みの除外リスト、および遅延読み込みの除外リストです。1つのリストに追加するだけで終わってしまうのが、この点で最もよくある見落としであり、それが「除外が機能しなかった」と誤解される原因となっています。
その後、すべてのキャッシュを削除し、プライベートブラウジングウィンドウでページを開き、フィードがスタイルを維持したまま読み込まれることを確認してください。
ページビルダーには、もう1つ確認すべき点があります
何かを変更する前に、ビルダーのプレビューではなく、公開済みのページを確認してください。
ページビルダーのエディタでは、実際のサイトとは異なる表示になります。Elementor、Oxygen、Diviのエディタ内で表示が崩れているように見えるフィードでも、訪問者には問題なく表示されていることが非常に多いのです。
作業内容を保存し、エディタを終了してから、プライベートブラウジングウィンドウでライブページを開いてください。
この最後の点が重要なのは、プライベートウィンドウではブラウザのキャッシュが bypass され、初めてサイトを訪れたユーザーが実際に目にする画面が表示されるからです。フィードが表示されていれば、問題はありません。
ライブページでフィードが本当に表示されていない場合は、次の2つの方法を試してみてください。
フィードは、ネストされた動的コンテナではなく、標準のコンテンツモジュールまたはウィジェットモジュールに配置してください。シンプルなモジュールは予測可能な順序で読み込まれるため、フィードのスクリプトに必要な要素が確実に提供されます。
その後、変更を行うたびに、ビルダー独自のCSSキャッシュをクリアしてください。Elementorでは、この機能は「Elementor」＞「ツール」内にあり、そこで「CSSとデータを再生成」をクリックします。
ビルダーは生成したスタイルシートを個別に保存するため、他のキャッシュをクリアした後でも、古いCSSが残ってしまうことがあります。
各ビルダーごとの操作手順については、Diviおよび Oxygen向けのガイドをご用意しています。
一度修正しておけば、変更のたびに再確認する必要がなくなります
「Smash Balloon Instagram Feed Pro」は、テーマの変更やプラグインの更新時でもフィードの表示を正常に維持し、設定の際に第三者の目による確認が必要な場合には直接サポートを提供します。14日間の返金保証付きです。
Instagramフィードプロを入手よくある質問
新しいプラグインをインストールした直後に、フィードが表示されなくなってしまったのはなぜですか？
多くの場合、これは新しいプラグインが、キャッシュ、ミニフィケーション、またはJavaScriptの読み込み遅延によって、サイト上のスクリプトの読み込み方法を変更しているためです。そのプラグインを無効にして、フィードを確認してください。フィードが正常に表示されるようになれば、プラグインを削除する必要はなく、前述のSmash Balloonの除外設定を追加するだけで済みます。
WordPressのテーマを変更すると、フィードの設定はリセットされますか？
いいえ。フィードの設定は、Smash Balloonプラグインによってデータベースに保存されており、現在有効になっているテーマとは完全に独立しています。テーマを何度変更しても、フィードの設定は変更前の状態のまま復元されます。
それが本当に競合なのか、それとも別の問題なのか、どうすれば見分けられるのでしょうか？
不具合が再現できる場合は、それが競合であることがわかります。あるプラグインやテーマを無効にするとフィードが表示され、再び有効にするとフィードが消えるという現象が起これば、原因が特定できたことになります。もしフィード表示領域に接続エラーやトークンエラーのメッセージが表示されている場合は、それはまったく別の問題です。
テストのためにプラグインを無効にすると、データが失われてしまうのでしょうか？
いいえ、プラグインを無効化しても、その設定やコンテンツはすべてそのまま残ります。データを削除するのは、プラグインを削除した場合のみです。本番サイトで一瞬だけ表示が乱れるのが気になる場合は、アクセスが少ない時間帯にテストを行うか、ステージングサイトでテストを行ってください。
もしコンフリクトテストで原因が特定できなかった場合はどうすればよいでしょうか？
次に確認すべき点が3つあります。ブラウザのコンソールを開いて具体的なJavaScriptエラーを確認し、すべてのキャッシュ（ホスト、CDN、ページキャッシュ、ブラウザ）が実際にクリアされたことを確認し、WordPressの外側に位置し、プラグインのテストでは検出されないCloudflare Rocket LoaderのようなCDNレベルの最適化機能がないか確認してください。 これを無効にするには、Cloudflareのダッシュボードで「Speed」→「Optimization」の順に選択します。これらを試しても原因が特定できない場合は、テーマ名、プラグインの一覧、およびコンソールのエラー内容を添えてサポートにお問い合わせください。
テーマやプラグインの変更にも影響を受けないフィード
タイミングを確認し、競合テストを実行してから、その結果に基づいて適切な修正を適用してください。「テーマ」とは、AJAXによるテーマ読み込みの修正を指します。「最適化プラグイン」とは、Smash Balloonディレクトリを除外リストに追加することを意味します。「ページビルダー」とは、何よりもまず実際のページを確認することを意味します。
これらを順番に確認していけば、当て推量することなく原因を突き止められます。発生したタイミングから、何が変化したかがわかります。競合テストにより、どの部分が原因であるかが判明します。修正は通常、1つの設定項目か除外リストの1行を変更するだけで済み、その後のアップデート後もその状態が維持されます。
原因が何であれ、何も失われたわけではありません。フィード、設定、および連携済みのアカウントは、ずっとデータベース内に残っていました。単にページがそれらを正しく表示できなかっただけです。
Instagram Feed Proは、サイト周辺の変更があってもフィードの表示を正常に維持します。また、設定の際に別の視点からの確認が必要な場合にも、直接サポートを提供します。
また、複数のソーシャルフィードを運用している場合は、「All Access Bundle」を利用すれば、Smash Balloonのすべてのプラグイン（Instagram、Facebook、Twitter/X、YouTube、TikTok、レビュー、ソーシャルウォール）を1つのライセンスで利用できます。
