wordpressでjavascriptライブラリを読み込むときの注意点など

最近、お仕事でWordpressを使ってサイトの立ち上げなどを行っているのですが、自作javascriptライブラリの読み込ませかたが分からなかったので調べてみた。ちょっと癖があるようなのでまとめてみるよ。
ちなみに、wp-content/themesからのカスタマイズです。プラグインはまだ勉強中ですね。。

通常の読み込みなどではheader.phpに下記の様に記述を追加して、外部ライブラリを読み込ませる方法で問題ありません。

<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/myfunc.js"></script>

しかし、WordpressではjQuery,script.aculo.usなどのjavascriptフレームワークを複数使用するので、wp_enqueue_scriptという関数を利用して、くり返し読み込まない様にキューに格納して出力する配慮がなされています。

wp_enqueue_scriptを使った読み込み方は下記になります。書き込む位置はfunctions.phpになります。

<?php
function add_js_library() {
        // 第一引数はハンドル名
	// 第二引数はスクリプトへのパス
	// 第三引数は依存するjsフレームワーク名の配列
	// 第四引数はスクリプトのバージョン
	wp_enqueue_script('my_js_func', TEMPLATE_DIR .'/js/myfunc.js', array('jquery'), '1.0');  
}
// 上記関数をフックに追加
add_action('wp_print_scripts', 'add_js_library');
?>

一応上記の方法で、myfunc.jsは読み込めるようになりますが、これだと管理画面でもmyfunc.jsを呼び出してしまうという副作用が発生します。テンプレートを使ったカスタマイズでは、header.phpに下記の様に書くのがお勧めな様です。

<?php wp_enqueue_script('my_js_func', TEMPLATE_DIR .'/js/myfunc.js', array('jquery'), '1.0'); ?>
<?php wp_head(); ?>

ひさびさにソースコードをごそごそやりたいのですが、納期でがっちがち (-''-;

参考サイト様

テーマでwp_enqueue_scriptを使う – Waviaei
トピック: ヘッダ部分wp_headの制御 « サポートフォーラム — WordPress

WordPress レッスンブック 3.x対応

PHPによるWordPressカスタマイズブック―3.x対応