WordPress で、外部 JavaScript を読み込むプラグインを作成する際、"wp-head" をフックして <head> 内に書き込むことは良くあると思う。
ただ、これだと jQuery やら prototype.js やらのライブラリが必要なプラグインを複数アクティブにした場合、同じライブラリを複数読み込んでしまうことになる。
しかも、それぞれのプラグインが読み込んでいるライブラリのバージョンが違うと目も当てられない。
で、そんな混乱を避けるために WordPress 2.1 から導入されたのが wp_enqueue_script() 関数などの一連の関数群と "wp_print_scripts" と言うアクションフック。
これらを使えば、JavaScript ライブラリのロードは簡単になる。
以下、使用方法を簡単に。
wp_enqueue_script( $handle, $src = false, $deps = array(), $ver = false )
- $handle スクリプトの識別名
- $src スクリプトへのパス(オプション)
- $deps 依存するスクリプトの識別名を配列で列挙(オプション)
- $ver バージョン(オプション)
jquery や prototype.js, scriptaculous なんかはデフォルトで登録されているので、$handle を渡すだけでOK。
他にデフォルトで登録されているライブラリが調べたい人は wp-includes/script-loader.php を参照してみてください。
使用例
function addScripts() {
if (!is_admin()) {
wp_enqueue_script('jquery');
wp_enqueue_script('wp-lightpop', get_settings('site_url').'/wp-content/plugins/wp-lightpop/js/jquery.lightpop.js', array('jquery'), '0.5.0');
}
}
add_action('wp_print_scripts', 'addScripts');
こうすることで、<head> がこんな感じになる。
<script type='text/javascript' src='http://dogmap.jp/wp-includes/js/jquery/jquery.js?ver=1.2.3'></script> <script type='text/javascript' src='http://dogmap.jp/wp-content/plugins/wp-lightpop/js/jquery.lightpop.js?ver=0.5.0'></script>
他のプラグインで wp_enqueue_script('jquery'); していても jquery.js は、1度しか書き出されない。
しかも wp_enqueue_script('prototype'); されていたら、コンフリクトが発生しないようにロード順を調整してくれるのでチョー便利。
書き出されるスクリプトの後ろに ?ver=hoge が着くのが嫌な場合は "script_loader_src" フィルタをフックしてやれば、好きなように加工できる。
@wokamoto すいません。こないだ教えてもらったwp_enqueue_script()はwp_footer()からも出せないでしょうか？ http://t.co/W4lEp1xQ 手書で[ココ</body>]ってのもスマートじゃないなと・・・
wp_enqueue_script のススメ : dogmap.jp http://t.co/MkWCLBs0
メモ。ちゃんとこの関数を使うようにしよう… wp_enqueue_script+のススメ http://t.co/7k4CqByw
@wokamoto すみません、WP関連で質問があります。jQueryをWP同梱のものではなく、google等から引っ張ってきたいと思い、wokamotoさんのサイト http://bit.ly/iiBu1R や http://bit.ly/dYfu1e
などを参考に（続く）
@mokeco_ wp_enqueue_script() 関数は使ってはりますか？ http://j.mp/l41XKI
wp_enqueue_script のススメ : dogmap.jp: http://bit.ly/jfVCyR
wp_enqueue_script のススメ http://t.co/65RqgFT
なるほど。WordPressからJSを呼ぶために関数まで用意してあるのかぁー。
http://dogmap.jp/2008/07/12/wp_enqueue_script/
wp_enqueue_script+のススメ http://t.co/HZGnjsJ
「"script_loader_src" フィルタをフック」がイマイチわからなかったので、class.wp-scripts.phpの「$src = add_query_arg('ver', $ver, $src);」をコメントアウトしてversion表記を無効化した。