このWEBサイトは「WordPress」で作っており、無料テーマの「Cocoon」を使っています。

今回起こった事は、よくある「ホームページ全体が真っ白になる」などの現象ではなく、ページは開くけどスタイルが崩れていたり、画像などの一部が表示されていない現象に陥りました。
Cocoonの子テーマをゴリゴリにカスタマイズしている方は、今回と同じ現象になったりする可能性がありますが、対処法が分かってれば、今後同じような事が起こった時はすぐに対処出来ると思います。
エラー時の現象
このサイトは大きく分けて2つのカテゴリーになっており、「ブログ(スポット・個人)」と「スポット紹介」で、ブログページには何の問題が無かったものの、スポット紹介ページが変な事になっていました。
スポット紹介ページで起こった現状
画像は全て表示されておらず、サイドバーも表示されてなくてスタイルがバラバラです。
(プラグインEWWW Image Optimizerを再インストールすると何故か画像だけは表示されました)
下へスクロールすると、一番下にメッセージが表示されており、このリンク先へ飛んで見てみるも、該当する項目が無かったです。
Cocoon設定ページで起こった現状
『WordPress側じゃなかったらCocoon側かな?そう言えば最近親テーマの更新が有ったし、そのせいかも』などと思い、Cocoon設定を見ようとすると、こちらも開きません。
開かないのは「Cocoon設定」だけで、他のページは問題なく開きます。
色々やってみたこと
よく言われている対処法を5個全て試す
エラー時の対処法でよく言われている事を試しましたが、テーマを変えるしか変化がありませんでした。
- プラグインを全て無効化にする
→ × 駄目 - 「functions.php」の中のコードを全て削除してアップ
→ × 駄目 - サーバーのPHPを8.1から8.0にしてみる
→ × 駄目 - 「.htaccess」を一度無効にしてみる
→ × サーバーエラーでサイトが開かない - 子テーマを親テーマに変更してみる
→ ○ ちゃんと表示される!
以上により親テーマではちゃんと表示される事から、子テーマに異常があると言う事が分かります。
(親テーマ変更後Cocoon設定も開きました)
次はどこがエラーを出しているのかを調べる段階です。
デバッグモードで調べてみる
サーバーのFTPで「wp-config.php」を触って、デバッグモードに切り替えます。
「define( ‘WP_DEBUG’, false );」を「define( ‘WP_DEBUG’, true );」にするとデバッグモードになります。
そうして表示されたコードが以下。
長ったらしいコードが表示されていますが、要は最後の太文字で表示されたファイルにエラーがあり、上記の場合「/home/users/2/hippy.jp-yappa-tarumi/web/wp-content/themes/cocoon-child-master/tmp/related-entries.php on line 20」と出ており、「related-entries.php」の20行目と言う事が分かります。
Cocoonをカスタマイズしている方なら、子テーマ内にtmpフォルダを作成し、その中で自分好みに変更なりしていると思いますが、今回のような事もあり『親テーマの更新があっても、子テーマでやっていれば大丈夫!』と言う概念が崩された瞬間でした。
で、子テーマ内の「related-entries.php」を一旦削除してみると、正常に表示されました。
原因判明からの対処法
変更前のコードには手を加えているのですが、初期のままのコードを以下に表示しています。
改行などの変更もあるにせよ、最後の関連記事系のコードが変わっています。
<?php /** * Cocoon WordPress Theme * @author: yhira * @link: https://wp-cocoon.com/ * @license: http://www.gnu.org/licenses/gpl-2.0.html GPL v2 or later */ if ( !defined( 'ABSPATH' ) ) exit; if (is_related_entries_visible()): ?> <aside id="related-entries" class="related-entries<?php echo get_additional_related_entries_classes(); ?>"> <h2 class="related-entry-heading"> <span class="related-entry-main-heading main-caption"><?php echo get_related_entry_heading(); ?></span> <?php if (get_related_entry_sub_heading()): ?> <span class="related-entry-sub-heading sub-caption"><?php echo get_related_entry_sub_heading(); ?></span> <?php endif ?> </h2> <div class="related-list"> <?php //関連コンテンツユニット以外 if (get_related_entry_type() != DATA_AD_FORMAT_AUTORELAXED) { get_template_part('tmp/related-list'); } else {//関連コンテンツユニットの場合 //AdSense広告表示が許可されている場合 if (is_all_adsenses_visible()) { get_template_part_with_ad_format(DATA_AD_FORMAT_AUTORELAXED, 'ad-related-autorelaxed', false, get_ad_related_contents_unit_code()); } } ?> </div> </aside> <?php endif //is_related_entries_visible ?>
<?php /** * Cocoon WordPress Theme * @author: yhira * @link: https://wp-cocoon.com/ * @license: http://www.gnu.org/licenses/gpl-2.0.html GPL v2 or later */ if ( !defined( 'ABSPATH' ) ) exit; if (is_related_entries_visible()): ?> <aside id="related-entries" class="related-entries<?php echo get_additional_related_entries_classes(); ?>"> <h2 class="related-entry-heading"> <span class="related-entry-main-heading main-caption"> <?php echo get_related_entry_heading(); ?> </span> <?php if (get_related_entry_sub_heading()): ?> <span class="related-entry-sub-heading sub-caption"><?php echo get_related_entry_sub_heading(); ?></span> <?php endif ?> </h2> <div class="related-list"> <?php //関連記事 get_template_part('tmp/related-list'); ?> </div> </aside> <?php endif //is_related_entries_visible ?>
さいごに(まとめ)
よく言われている「プラグインを全て無効化する」等も対処法の1つですが、今後は「デバッグモードで調べる」も原因を探る上での項目ではないでしょうか。
※デバッグモードを元に戻す(true → false)ことを忘れずに。
Cocoonの更新があった時は、各ページの確認を怠らないようにしましょう。
コメント