jQueryプラグインを<head>内で読み込む方法

WordPressデフォルトでは読み込まないjQueryプラグインを<head>内で読み込みたい場合、以下の方法を使うと便利。

<head>が記述されているファイル(通常ならheader.php)内で、「wp_enqueue_script()」という関数を使う。

書式は以下。
wp_enqueue_script( $handle, $src = false, $deps = array(), $ver = false );
---------------------------------------------------------------------------
$handle : 識別名(他と重複しなければ何でも良い)
$src: スクリプトファイルへのパス(オプション)
$deps: 依存するファイル(オプション)
$ver: スクリプトのバージョン(オプション)

例えば、
wp_enqueue_script('jquery');
wp_enqueue_script('function', '/js/function.js', array('jquery'));

と記述した場合、

<script type='text/javascript' src='http://sample.com/wp-includes/js/jquery/jquery.js?ver=1.7.1'></script>
<script type='text/javascript' src='http://sample.com/js/function.js?ver=3.3.2'></script>

と出力される。自分で作成したjsファイルで、バージョンなどは特に関係ないという場合、HTML出力されたコードに「?ver=3.3.2」のような記述があっても気にしなくて良い。

この関数は、依存関係や重複を自動的に考慮してHTMLに出力してくれるので非常に便利。例えば、jQueryプラグインファイルを「jquery.js」の後に読み込んでくれたり、他の場所で既に読み込まれている場合には読み込まないようにしてくれたりなど、挙動がおかしくならないように調整してくれる。

スポンサードリンク

twitterまたはFacebookでもコメントして頂けます