この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の更新があった時は、各ページの確認を怠らないようにしましょう。
コメント