Yoast SEO の設定画面の表示が崩れてしまった時の対処法

Yoast SEO をインストール後設定画面を開いてみるとどうも表示がおかしい。インストール直後から明らかに崩れていました。

解決方法とその原因究明方法をご紹介します。同じようなエラーではなくとも、何かしらのエラーになった時の原因を探す時の参考にもなればと思います。

Yoast SEO | WordPress プラグイン

解決内容

Yoast SEO の設定画面の正常な状態はこのような画面です。

それがこのような状態で表示されてしまいました。

稀なエラーだったかもしれませんが、原因は functions.php に記載していた「jsのパラメータに付与されるWordPressのバージョン情報を削除」のコードでした。

この記載が良くなかった。

//jsのパラメータに付与されるWordPressのバージョン情報を削除
function remove_cssjs_ver( $src ) {
  if ( strpos( $src, 'ver=' ) ){
    $src = remove_query_arg( 'ver', $src );
    return $src;
  }
}
add_filter('style_loader_src', 'remove_cssjs_ver', 9999);
add_filter('script_loader_src', 'remove_cssjs_ver', 9999);

特に重要なものではなかったのでこれをコメントアウトして正常に戻りました。

エラーの原因究明

この解決に至るまでの原因究明方法を記載します。プラグインでエラーが発生した場合はこの原因を探し当てるのが一苦労ですよね。

検索で一発で解決策が見つかれば良いのですが、今回はそうではありませんでした。
まず「Yoast SEO 表示崩れ」や「yoast seo 設定画面がおかしい」で検索してみましたが、全く欲しい情報は出てきません。

検索でうまく見つけられないとなると自分で探し出すしかありません。思い当たるところを片っ端から見直していきます。

何が悪いかとりあえず考えてみる

デベロッパーツールで見てもエラーはないのでシステムは大丈夫そう。
どうやら他の正常に動いている Yoast SEO と比べると Yoast SEO 専用のCSSが効いていないことが分かりました。

ここで「Yoast SEO css が効いていない」で調べてもやっぱり検索結果には出てきません…

そこでまず、管理画面専用のCSSを設定していたので、それが悪さをしていると思い一旦その専用CSSを排除してみます。

うまくいかない。

プラグインなら再インストール

プラグインのインストールが正常にできなかったかもと思い、一度プラグインを削除してもう一度インストールしてみます。

直らない。

その画面で機能しているテンプレートファイルを見直す

管理画面だからfunctions.phpか…と思って該当しそうな箇所を探してみるも、よく分からず…
全機能を停止するのは賭けでしたが、そんなに見られるサイトではなかったのでとりあえず記載している内容をコメントアウト。

正常に表示された!

functions.php に書かれている内容に原因があることが分かったので、あとは問題の場所をピンポイントであぶり出していくのみ。

私はfunctions.php に書く内容をさらに機能ごとにファイル分けしているので、各ファイルごとにコメントアウトを外していきました。

この形でやっているとこういう時に便利だなーとしみじみ感じます。

そして見つけたのがここの記述でした。

//jsのパラメータに付与されるWordPressのバージョン情報を削除
function remove_cssjs_ver( $src ) {
  if ( strpos( $src, 'ver=' ) ){
    $src = remove_query_arg( 'ver', $src );
    return $src;
  }
}
add_filter('style_loader_src', 'remove_cssjs_ver', 9999);
add_filter('script_loader_src', 'remove_cssjs_ver', 9999);

スクリプトのバージョン情報はあった方がいいらしい

?ver= がついていないと動かないことがあるんですね。他のプラグインでももしかしたらエラーになる可能性もあるかもしれないので参考までに。

カテゴリー : WordPress

TOPへ