WordPress5.5にバージョンアップしたらヘッダーでjQueryが読み込まれなくなった

WordPress5.5にバージョンアップしたところ、jsエラーが発生しました。
表示されるエラーは Uncaught ReferenceError: jQuery is not defined 。
要はjQueryがないよ、です。

慌ててソースを見ますと、ヘッダーではなくフッターでjQueryが読み込まれていました。
つまり、<?php wp_head(); >ではなく<?php wp_footer(); >がjQueryを呼んでいるっぽいです。

原因

WordPress5.5からjQuery Migrateが外れました。これにより jquery.js 呼び出しがヘッダー固定ではなくなったようです。使用しているプラグインが古かったり、更新ストップしてたりするとフッター読み込みになってしまいます。

対策

プラグインのアップデート

私の場合は古いプラグインのアップデートで直りました。
しかし、諸事情でプラグインのアップデートが難しいという場合もあるでしょう。その場合は以下の方法をお試しください。

jquery.js を強制的にヘッダー表示する

1 FTP より wp-content/plugins フォルダに my-plugin フォルダを作成

2 my-plugin.php ファイル を作成し my-plugin フォルダにアップ

my-plugin.php

<?php
/*
Plugin Name: my-plugin
Plugin URI:
Description: My Plugin For WordPress.
Version: 1.0.0
Author: 
Author URI: 
License: GPLv2 or later
*/

/** jquery.js を強制的に ヘッダー表示する**/
if(!function_exists('nendebcom_jquery_header_script')) {
	function nendebcom_jquery_header_script() {
		global $pagenow;
		global $wp_scripts;
		if(is_admin() || is_feed() || 'wp-login.php' == $pagenow) {
			return;
		}
		
		$jquery = $wp_scripts->registered['jquery-core'];
		$jquery_ver = $jquery->ver;
		$jquery_src = $jquery->src;
		
		wp_deregister_script('jquery');
		wp_register_script('jquery', $jquery_src, array(), $jquery_ver, false);

		wp_deregister_script('jquery-core');
		wp_register_script('jquery-core', $jquery_src, array(), $jquery_ver, false);

		wp_enqueue_script('jquery');
	}
	add_action('wp_print_scripts', 'nendebcom_jquery_header_script', 999);
}
?>

3 管理画面でプラグインを有効化する

参考元:WordPress5.5 で予想される 不具合について

WordPressのバージョンアップに伴い仕様変更が予測されますので、このコードは一時的なものと思ったほうがよさそうです。

書いた人:やまライダー(嫁)

Web屋さんで8時間フルタイム勤務をしている、いわゆるワーキングマザー。
夫婦共働きで、ムスメ氏を育てています。
主に資産運用にかかわるお金の話、ムスメ氏を育てていく上での子育ての話、そしてたまにお仕事関連の記事を書いていく予定。
プロフィールを見る