【WordPress】JavaScriptファイルを読み込む方法

1. functions.php内にファイルの読み込みに関する記述をまとめた関数(*)を用意する
2. (*)内にwp_enqueue_script()関数を記述し、読み込むファイルを区別するための名前やファイルパス等を引数で指定する
3. (*)をwp_enqueue_scriptsアクションフックに登録する
4. 今までfooter.phpの手前に記述していた、JavaScriptファイルを読み込むためのscriptタグを削除し、代わりにwp_footer()関数を記述する

コード(functions.php)

<?php
my_scripts_init() {
  wp_enqueue_script( 'script-name', get_template_directory_uri() . '/js/script.js', array( 'jquery' ), '1.0.0', true );
}
add_action( 'wp_enqueue_scripts', 'my_scripts_init' );

コード(footer.php)

  <footer>
    ～省略～
  </footer>

  <?php wp_footer(); ?>
</body>
</html>

参考記事

• WordPressでファイルを読み込むためのwp_enqueue_styleとwp_enqueue_scriptの使い方と引数の意味を理解しておこう。
• 【WordPress】wp_head()とwp_footer()の役割と中身は何なのか？使い方とコードを実例で確認