Javascriptの読み込み指定

WordPressのテーマのJavaScript読み込みをfunctions.phpで制御する方法

WordPressテーマにJavaScriptを読み込む際、footer.phpなどのテンプレートファイルに直接書き込むのではなく、functions.phpで制御する方法が推奨されています。
functions.phpで管理する場合は、”wp_enqueue_script関数”を使ってJavaScriptファイルの読み込みを制御します。

外部JavaScriptを読み込む

wp_enqueue_script()には, 、スクリプトの重複読み込みを回避し、最適な順番で読み込んむよう制御してくれます。また、wp_enqueue_script()には下記のパラメーターがあります。内容を理解して正しく設定しましょう。

wr_enqueue_script
①$handle
$handle部分にはハンドルネームを指定します。jsファイルの名前をそのまま使うと分かりやすいかと思います。この名前を使ってスクリプトを判別します。
②$src
$src部分にはスクリプトのURLを指定します。
③$deps
$deps部分でスクリプトの読み込み順を制御できます。array( ‘jquery’ )と指定すれば、ハンドルネーム jquery のスクリプトの後に読み込みます。
④$ver
$ver部分では任意のバージョンを指定できます。スクリプトURLにクエリパラメーターとして追加されるので、ブラウザキャッシュ対策になります。
⑤$in_footer
$in_footer部分では、スクリプトの読み込み位置を指定できます。trueで</body>終了タグの前に、falseで<body>タグの前、出力します。

上記の内容を踏まえた上での利用例

下の利用例では、!is_admin()で管理画面以外の部分で適用するように指定しています。
wp_deregister_script(jquery); 公開サイトではWordPress同封のjQueryは読み込ませないという設定にまります。CDNのjQueryを使用しますという設定です。
wp_enqueue_script()の部分で読み込むスクリプトの指定をしています。

wp_enqueue_script()のハンドルネーム「config」の記載方法は以下のページを参考に作成しました。


JunJunWeb.Netの新着情報を受け取るには
SNSアカウントをフォローすると便利