[wp]functions.phpで外部jsを</body>直前に出力させる方法

使うっちゃ使う。

とりあえず普通にやる

こう。

add_action('wp_enqueue_scripts', 'add_headFiles');
function add_headFiles() {
    if(is_admin()) return;
    wp_enqueue_script('jQuery', 'https://code.jquery.com/jquery-3.6.3.js', array());
    wp_enqueue_script('scripts', get_template_directory_uri() .'/js/scripts.js"', array());
}

「wp_enqueue_script()」は色々引数があるんだけど省略するとこんな感じになる。

で、この状態だと<?php wp_head ?>で出力される。
つまり、<head>内で出力される。

</body>直前に出す

こう。

add_action('wp_enqueue_scripts', 'add_headFiles');
function add_headFiles() {
    if(is_admin()) return;
    wp_enqueue_script('jQuery', 'https://code.jquery.com/jquery-3.6.3.js', array(), '', true);
    wp_enqueue_script('scripts', get_template_directory_uri() .'/js/scripts.js"', array(), '', true);
}

省略してた引数を書き込む。
最後の「true」が</body>直前で出力するためのトリガーになる。

どういうときに使うか

まあ色々あるんだけど、swiper.jsとかの非jQuery系は後で読み込ませなきゃ動かなかったりする。
そういう縛りがあるときに、それでもテーマに直書きしたくないなら、っていう場合に使う。

コメント

タイトルとURLをコピーしました