WordPressでjQueryのスクリプトを実行する時に、エラーになって動かなかったことはないでしょうか?
よくあるのが、他の人が公開しているスクリプトをコピペしたけど、$が見つからないというエラーになってしまうことです。
WordPressでは、jQueryの$ショートカットが使えないので、カプセル化するなどソースコードを変更することで対応します。しかし、これが結構面倒だと思っている人は多いと思います。
このWordpressの制限は理由あってのことですが、ほとんどの場合必要ないので、自分で無効化したいと思っている人も多いと思います。
このWordpressのjQueryのショートカット制限を簡単に外せることが分かったのでまとめておきたいと思います。
この記事を読むことで、WordpressでjQueryを使うときに$を使えるか悩む必要がなくなるので、ネットで公開されているjQueryスクリプトをそのまま使うことができるようになります。
なぜWordpressのjQueryでは$を使えないのか?
理由
WordPressに付属しているjQueryにそのような制限があるから。
制限を与えている個所
WordPressに含まれるjquery.jsの一番最後にjQuery.noConflict();の記述があります。
jQuery.noConflict();
別のjQueryを読み込めば解決
WordPressで標準で読み込むjQueryの読み込みをやめて、googleが用意しているCDNから読み込むように変更します。
function load_cdn() {
if ( !is_admin() ) {
wp_deregister_script('jquery');
wp_enqueue_script('jquery', 'https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js', array(), '1.7.1');
}
}
add_action('init', 'load_cdn');
まとめ
他の人のサイトを見ていた時に、jQueryを使っているのにカプセル化しないで$をそのまま使ってるのを見かけたときにカラクリがよくわからなかったのですが、これですっきりしました。
CocoonなどはもともとGoogle CDNからjQueryを読み込む仕様になっているので、今回の処置は必要ありません。