jQuery のサンプルコードってかなり前から多数出回っていて、
「これをコピペすればこうなりますよ」
というレベルで紹介されているものも少なくありません。
でも、実際試そうとしたら、自分のサイトではピクリとも動かない・・・

こんな経験無いでしょうか？
自分がまさにそうで、この部分でドハマりして当初 jQuery は挫折してました。

そういった際の対処方法をご紹介します。

あるサイトから「そのまま動く」と明記されているコードを拾ってきます。
例えば、以下のような感じで大抵は書いてあると思います。
（実際の処理は省略してます）

$(document).ready(function(){
    // jQueryの処理
});

これを WordPress のテーマに組み込んでみたら動かない（エラーが出る）、
サンプルHTMLを丸ごとコピーして html ファイルを生成したら問題ない。

自分の場合、ここでチンプンカンプンになりました。
WordPressは標準で jQuery がアドオンされているのに、何故動かない？？？

これは、 WordPress を含む多くの CMS で該当すると思うのですが複数の JavaScript アドオンを導入していることで、jQuery の省略型である ” $(なんたらかんたら) ” という記述方法が有効になっていない場合があるようなのです。

もう一度先ほどのコードを見てみましょう。
最初の文字がダラー（$)になっています。

$(document).ready(function(){
    // jQueryの処理
});

純粋に jQuery をアドオンしたサイトなら自動的に「$」を別名として利用できるのですが、CMSの場合、同様に $ を別名とするアドオンを利用していることがある（詳しく知りませんが）ようで、この別名定義をキャンセルか何かしている可能性があります。

なので「$なんて知らん！」とエラーになるわけです。

ではどうすればいいのか？

＄を使わないで jQuery を呼び出し、
その命令内で省略形を別名定義すればいい。

分かりにくいですね。
先ほど「別名」と言いましたが、当然別名なので「本名」があります。
その本名は「jQuery」です。
つまり、$ を jQuery に書き換えれば動く のです。
ただ、全部の $ を差し替えるのも面倒なので、別名定義も同時に行います。
改善後のコードが以下の通りです。

jQuery(document).ready(function($){
    // jQueryの処理
});

このように、書き変えればOKです。
function($) が別名定義になってくれています。
さらにもっと手を抜けば、

jQuery(document).ready(function($){ //ここから
$(document).ready(function(){
    // jQueryの処理
});
}); //ここまで

といった感じで、該当の命令をごっそり  jQuery(document).ready(function($){}); で囲ってやればOKです。

原因が $ の別名定義のせいであれば殆どの場合これ動くはずですので、是非お試しください。

でわまた :soldier: