wp_enqueue_script() 関数はスクリプトを読み込むために利用される関数です。

wp_enqueue_script() 関数とは

WordPress で JavaScript ファイルを適切に読み込むためにキューに登録し、ページに追加するための関数です。テーマやプラグイン開発に取り組む上では、かなり触れることが多い関数なのではないでしょうか。

パラメーター

使い方

この関数を使った JavaScript を読み込みは、WordPress が推奨する方法です。header.php や footer.php などに <script> タグを使ってハードコーディング（直接書き込む）で読み込まれている場合は、こちらの利用をお勧めします。

一般的には、wp_enqueue_scripts フックを通して、当関数でスクリプトをキューに登録します。

add_action(
	'wp_enqueue_scripts',
	function () {
		wp_enqueue_script(
			'my-theme-script',
			get_template_directory_uri() . '/assets/js/my-theme-script.js',
			array(),
			'1.0.0',
			array(
				'in_footer' => true,
				'strategy' => 'defer',
			)
		);
	}
);

WordPress 6.3 から、以前は $in_footer パラメーターが利用できましたが、それに代わり $args パラメーターを使い、スクリプトの読み込み方法を指定することができるようになりました。

defer

array( 'strategy' => 'defer' )

これを $args パラメーターに指定することで追加できます。

defer を指定したスクリプトは、DOM ツリーが完全に読み込まれた時点（DOMContentLoaded や window load イベントの前）で実行されます。

defer スクリプトは、非同期スクリプトとは異なり、DOM に出力／追加された順番に実行されます。

async

array( 'strategy' => 'async' )

これを $args パラメーターに指定することで追加できます。

async を指定したスクリプトは、非同期スクリプトとしてブラウザに読み込まれるとすぐ実行されます。

非同期スクリプトは実行される順番が保証されていないことに注意しましょう。

メモ

• 管理画面で呼び出す場合には admin_enqueue_scripts アクションフックを使う
• ログイン画面で呼び出す場合には login_enqueue_scripts アクションフックを使う

フック

ありません。

まとめ

WordPress テーマやプラグインを開発されたことがある方であれば、利用されている関数でしょう。利用する状況（管理画面やログイン画面など）によっては、読み込む最適な関数が変わってくるので注意が必要です。

wp_enqueue_script() – Function | Developer.WordPress.org

Enqueues a script.

developer.wordpress.org