WordPressでjQueryライブラリが読み込まれない原因は？

WordPressサイトで、jQueryを使ったjavascriptを書いたとします。そのjavascriptを読み込むとjQueryが見つかりませんという状況になってしまったことがありませんか？

この記事では、WordpressでjQueryライブラリが読み込まれない時に、jQueryを読み込むにはどうするのが良いのかメモしています。

jQueryのその他のよくあるトラブルについては以下をご参照ください。

この記事で分かること

よくある事例
なぜWordpress付属のjQueryライブラリが読み込まれない？
1. 忘れられがちな事実
2. 脱jQueryが進んでいるテーマやプラグインが増えている
WordPress付属のjQueryライブラリを読み込むには？
まとめ

よくある事例

jQueryライブラリが読み込まれなくなるよくある事例として以下があります。

プラグインを停止・削除したらjQueryライブラリが突然読み込まれなくなった
WordPressにログインしてないとjQueryライブラリが読み込まれなくなった

jQueryを読み込んでいたプラグインを停止したり、プラグインのバージョンアップでjQuery未使用となったりする場合、サイトでjQueryが読み込まれなくなってjQueryのスクリプトが急にエラーになります。

なぜWordpress付属のjQueryライブラリが読み込まれない？

忘れられがちな事実

WordPressでは付属のjQueryが必ず読み込まれると思っていませんか？

WordPressでは、jQueryを使用するテーマやプラグインを有効化した時だけ、Wordpress付属のjQueryが読み込まれます。それ以外の場合は管理画面しかjQueryライブラリは読み込まれません。

脱jQueryが進んでいるテーマやプラグインが増えている

脱jQuery化が進んでいる最近のWordpressの有料テーマでは、テーマだけ有効化してもjQueryが読み込まれないことがあります。

また、プラグインのバージョンによって脱jQueryになっている場合は、突然jQueryが読み込まれなくなります。

jQueryを使っているプラグインを読み込んでいる場合でも、高速化のためにplugin load filterで読み込むページを限定している場合など、条件によってjQueryが見つかりませんとなることがあります。

WordPress付属のjQueryライブラリを読み込むには？

自分で積極的にjQueryを読み込んでもいいのですが、それだと2重に読み込まれたりするので上手くないです。

以下の記述をfunctions.phpに追加すれば、jQueryが読み込まれます。

これはテーマディレクトリに./js/script.jsというファイルがあって、それを読み込ませるときに依存関係でjQueryを指定しています。そうすると、Wordpressが勝手にjqueryを読み込むようになります。

wp_enqueue_scriptで読み込ませて、array(‘jquery’)を指定してるのがポイントです。

add_action( 'wp_enqueue_scripts', 'wp_enqueue_my_scripts_custom' );
if ( !function_exists( 'wp_enqueue_my_scripts_custom' ) ):
function wp_enqueue_my_scripts_custom() {
	if (is_singular()) {
		wp_enqueue_script( 'my-js',  get_theme_file_uri('/js/script.js'), array('jquery'), false, true  );
	}
}
endif;

プラグインなどでも同じ仕組みでjQueryが自動的に読み込まれるようになっているのですが、この方法であれば2重に読み込まれることはありません。

jsファイルにjQueryスクリプトを記述していない場合は、中身のないjsファイルを用意して、上記のスクリプトで読み込むようにすれば、常にjQueryは読み込まれるようになります。