2017年7月24日2017年7月24日wpm
WordPress | wp_enqueue_script() | function コードリファレンス
wp_enqueue_script() は、WordPressのWebサイトに script スクリプを追加できる方法の1つです。エンキュー「enqueue」は、複数のプラグインの、スクリプトや他の共有 script も追加することができます。これは WordPress が生成するページに JavaScript をリンクする際に推奨されている方法です。
関数 wp_enqueue_script()

script スクリプトを追加
| タグ 使用方法 | <?php wp_enqueue_script()( $handle, $src, $deps, $ver, $in_footer ); ?> |
| パラメータ ( 引数 ) | $handle |
| 説明 | ハンドルはスクリプトのユニークな名前です。例えばハンドル名 ’wpm_my_script’ |
| パラメータ ( 引数 ) | $src |
| 説明 | srcは、スクリプトのパス(場所)です。URL で指定、例えば ”https://example.com/js/wpm-script.js” |
| または、プロトコルに影響されない URL で指定、例えば ”//example.com/js/wpm-script.js” |
| パラメータ ( 引数 ) | $deps |
| 説明 | depsは、このスクリプトと他のスクリプトの依存関係です。このスクリプトより前、先に読み込まれる必要があるスクリプトのハンドル名、例えば "wpm_before_script" |
| 依存関係がない場合は、’array()’ |
| パラメータ ( 引数 ) | $ver |
| 説明 | これはスクリプトのバージョン番号です。このパラメータは必須ではありません。 |
| 指定しない場合、’false’ |
| パラメータ ( 引数 ) | $ in_footer |
| 説明 | スクリプトの配置を決定します。デフォルトでは、値は「偽」です。'true'を入力すると、スクリプトがフッターに読み込まれます。 |
| 指定しない場合、'false' |
| 関連記事 | wp_enqueue_style() | スタイルの登録 |
実例・使い方
| テーマ独自のスクリプト追加・登録 例) |
| functionコード | <?php wp_enqueue_script( 'wpm_my_script','get_template_directory_uri()./js/wpm-script.js',array(), '1.0.0'); ?> |
| HTML | < script type='text/javascript' src="https://example.com/wp-content/themes/wpm-script.js?ver=1.0.0"> |
| テーマ独自のスクリプトをhead内のjQueryの後に追加・登録 例) |
| functionコード | <?php wp_enqueue_script( 'wpm_my_script',get_template_directory_uri().'/js/wpm-script.js',array('jquery'), '1.0.0'); ?> |
| HTML | <script type='text/javascript' src='https://example.com/wp-content/themes/js/wpm-script.js?ver=1.0.0'></script> |
| テーマのスクリプトをフッターに追加・登録 例) |
| functionコード | <?php wp_enqueue_script( 'wpm_my_script',get_template_directory_uri().'/js/wpm-script.js',array(), '1.0.0', true ); ?> |
| HTML | <script type='text/javascript' src='https://example.com/wp-content/themes/js/wpm-script.js?ver=1.0.0'></script> |
| プラグインのスクリプトをhead内のjQueryの後に追加・登録 例) |
| functionコード | <?php wp_enqueue_script('wpm_my_script', plugins_url( '/js/wpm-script.js', __FILE__) , array('jquery'),'1.0.0', true); ?> |
| HTML | <script type='text/javascript' src='https://example.com/wp-content/plugins/js/wpm-script.js?ver=1.0.0'></script> |