コリスさんが作成されたページの先頭や任意の要素に、スムーズにスクロールさせることができるスクリプト
「Page Scroller」を入れてみました。ページの右下の方にある「↑toTop」をクリックしてみてください。スムーズにページ上部へスクロールするはずです。
で、このスクリプトを実装するときに使ったのがwp_enqueue_script();と言うWordPressのアクションフック。Ver. 2.1から導入されたみたいなんだけど、プラグイン向けの関数と言うこともあって、その存在すら全然知りませんでした（汗）
wp_enqueue_scriptとは
何をするフックかと言うと、外部参照のスクリプトを：
- 重複しないように
- 適切な順番で
読み込むように自動的に調節してくれるフックです。なぜこんなのが必要かと言うと、最近のプラグインやWPコアの機能において、jQueryやscript.aculo.usと言ったJavaScriptのライブラリとそれらプラグインがよく利用されているからです。これらスクリプトはそれぞれ適切な読み込み順序があり、また当然の如く、同じライブラリを2回も3回も読み込むのは無駄です。
より詳しく知るにはこの２つの記事が勉強になります。
- wp_enqueue_script のススメ : dogmap.jp
- wp_enqueue_scriptで外部JavaScriptの読み込みをスマートに at WordPress.ex-libris.jp
使ってみると、便利ですね。もしテーマを自作したり、カスタマイズしたりする時は、スクリプトの外部参照をheader.phpのhead内に直接記述するのではなく、wp_enqueue_script();を利用するのが必須となってきそうです。
テーマではfunction.phpに記述する
プラグインではwp_enqueue_script();をプラグインファイルに記述すると思いますが、これをテーマで利用するにはfunction.php内に記述します。
今回はPage Scrollerで利用した訳ですが、function.phpには次の様に書きました。
[php]
function addWD6Scripts() {
wp_enqueue_script(‘PageScroller’, get_settings(‘site_url’).’/wp-content/themes/WaviaeiDesign6/js/jquery.page-scroller-303.js’, array(‘jquery’), ‘3.0.3’);
}
add_action(‘wp_print_scripts’, ‘addWD6Scripts’);
[/php]
addWD6Scriptsの箇所はadd WaviaeiDesign6 Scriptsの意味です。他の関数名と重複しないようにわざとこんな長い関数名にしています。wp_enqueue_script();は先ほど上げた２つのサイトを参考にしてください。
WordPress 2.7 の jQuery は1.2.6
ちなみに今回知ったのですが、WordPress本体にバンドルされているjQueryのバージョンはちょっと古くてver. 1.2.6でした。Page Scroller は、現在ver.3.0.6 が最新ですが、jQuery 1.2.6 では動作しません。Page Scroller ver. 3.0.3 が必要でした。
他のjQueryプラグインでも、WordPress で利用しようとすると同様の問題に当たるかもしれません。
ちなみに、WordPress 2.7.x にバンドルされている jQuery を、最新の jQuery 1.3.2 に置き換えて利用しようとすると管理画面でバグがあるらしいです。WordPress 2.8 で解決しているそうなので、それまで大人しく待った方が無難かと。
2009年5月15日 at 07:20
どもです。
wp_enqueue_script をテーマで使うときは、わざわざフックを通さなくても大丈夫です。
header.php の冒頭にいかのように書くだけでおっけ。
<?phpwp_enqueue_script('PageScroller', get_settings('site_url').'/wp-content/themes/WaviaeiDesign6/js/jquery.page-scroller-303.js', array('jquery'), '3.0.3');
?>
こうしておけば、管理画面では呼び込まれないというメリットもあります。
2009年5月15日 at 13:52
おおおっ、そうなんですか！ありがとうございます。
これってwp_headの前でもOKなんですかね？それともやっぱりあとじゃなきゃだめなのかな。
2009年5月15日 at 13:58
wp_enqueue_script() で登録された js は wp_head() の中で処理されるので、wp_head() より前に書かないとダメです。