【WordPress】Implement my own javascript.

独自に作成した、または、使いたいjavascriptをwordpressで読み込ませる。

header.phpではなくテンプレートごとに記述する方法

※事前に子テーマ内にfunctions.phpを作成をおススメします。間違えてたり、記入時に他のコードにインデントなど入ったりすると「画面が真っ白」になったり思わぬ不具合を防ぐため。

JSファイルを読み込ませる時はfunctions.php内にwp_enqueue_scriptを書きます。

wp_enqueue_script( $handle, $src, $deps, $ver, $in_footer );

wp_enqueue_script内の引数の内容は!

$handle・・・任意の名前※必須項目
$src・・・ファイルのURL
$deps・・・依存しているスクリプト
$ver・・・スクリプトのバージョン
$in_footer・・・スクリプトの読み込み位置(trueだと後、falseだと前。初期値だとfalseなので、headに読み込まれます。)

たとえば、 myScript.js を読み込ませたい場合

function my_Script_script() {
wp_enqueue_script( 'myScript', get_template_directory_uri().'/js/myScript.js',array(),'',true );
}
add_action( 'wp_enqueue_scripts', 'myScript_script' );

読み込み位置($in_footer)はの直前にしたいのではtrueにしています。何も書かなかったらhead内に書かれます。

子テーマの場合

子テーマ内に「js」フォルダーを作成してその中に、「myScript.js」がある場合

$srcの部分を変更する。「 get_stylesheet_directory_uri().’/js/myScript.js’ 」

function my_script() {
wp_enqueue_script( 'myScript', get_stylesheet_directory_uri().'/myScript.js' ,array(),'',true );
}
add_action( 'wp_enqueue_scripts', 'my_script' );

 

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