WordPressでjQueryを使うときの注意点の備忘録です。
まずはjQuery本体を読み込まなきゃって思ったときに、下記のように記述して、あれjQueryが動かない・・・ってつまづきました。
<?php wp_head(); ?> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.6/jquery.min.js"></script>
実はWordPressの wp_head(); で、jQuery本体が読み込まれてるということを知りました。
上記の記述だと違うバージョンのjQuery本体が２つ読み込まれてしまい、不具合を起こしやすいです。
しかも本体を２回もロードするので表示も遅くなります。
そこで、WordPress本体のjQueryを使う、古いバージョンのjQueryは使わないということに絞りました。
古いバージョンでしか動かないjsはセキュリティとか、今後の保守に問題があると思ったからです。
次に、WordPress本体のjQueryを使う際の注意点です。
自分でjQueryをコーディングってのはまだできないので、.jsファイルをダウンロードしたり、調べたりするのですが、大抵はwordpressで使うことを前提にしてないので、.jsファイルをそのままアップロードしても動きません。
wordpressでは、$() の代わりに jQuery() を使用しなければなりません。
$(function() {
$('#tab li').click(function() {
//省略
});
});
上記のようなjsだったとすると、下記のように変更することでwordpressで動くようになります。
jQuery(function($) {
$('#tab li').click(function() {
//省略
});
});
まだまだ勉強中ですので、これだけでは足りなかったり、問題もあるのかもしれませんが、大体はこれで動きます。