WordPressでjQueryが動かない時の対処法。エラー【Uncaught TypeError: $ is not a function】

WordPressでサイト制作している際のjQueryの記述の注意点

WordPressでjQueryを使用するときに、htmlで制作しているときと同じように

間違えているjsファイルの記述

$(document).ready(function () {
	hsize = $(window).height();
	$(".sb-slidebar").css("height", hsize + "px");
});

と記述した場合
Uncaught TypeError: $ is not a function
というエラーが出てしまって動かないんです…。

理由はあるけど、めんどくさいので深くはあえて説明しません。

簡単に説明すると、これはどうしてかというとWordPressでは'$'を使っているライブラリが他にもあるので、ぶつかってしまって動作してくれないんです。

そんな時は上記の記述をこのように変更します。

解決策

正しいjsファイルの記述

( function( $ ) {
	$(document).ready(function () {
		hsize = $(window).height();
		$(".sb-slidebar").css("height", hsize + "px");
	});
} )( jQuery );

( function( $ ) {・・・} )( jQuery );というコードで挟むことによって中のコードはいつも通りの記述で使用できるようになります。