WordPressでのjQuery

みなさん、jQueryは使ってますか。

jQueryを簡単に説明すると、JavaScriptという言語を省略しながら扱うことができ、本来であれば難しく記述しなくてはいけない部分もちょちょいのちょいでスクリプトを組めるという便利 なライブラリです。

現在の自分も、その便利さからよく使わせてもらっています。

ただ、Wordpressで使う際、ちょっとだけ調べなければ分からなかったことがあったのでメモ的に残しておきます。

WordPressでエラーがでる。

過去に、静的ページで使えていたjQueryをそのまま、Wordpressに流用しました。

しかし、コンソールを見るとなんとエラーが！

そこには、

$ is not a function

という文字が。。。

CDNで設定してある、順番も問題ない。なぜか分からなかったのですが、調べたら５分ほどで解決しました。

WordPressでは$が使用できない。

完全に使用できないというと語弊がありますが、Wordpressでは自分たちで$という文字を使いたいと思っているらしく、他のJavaScriptライブラリとの互換性の問題を防ぐため$が使えないそうです。

では、どう解決すればいいのか。

大きく分けて2つあります

$を全てjQueryに変える

例えばこれを

 
$(document).ready(function(){
  $(#somefunction) ...
});

こうする！

 
jQuery(document).ready(function(){
  jQuery(#somefunction) ...
});

$をラッパーする！

これを、、

 
$(document).ready(function(){
  $(#somefunction) ...
});

こうする！

 
jQuery(document).ready(function($) {

});

その場で$を定義してしまえばいい。

どちらにしても大きな問題が発生することはないと思いますが、前者の方が簡単なので私は前者を利用させてもらっています。

最後に

自分が初学者だった頃にこのエラーを見てギョッとしたおぼえがあります。

この記事を見て簡単に解決できることを願っています。