WordPressのバージョンアップをしたらjQueryが動かなくなったときにまずは確認すること

ブログ

2021.05.10

WordPressをバージョンアップしたり、サイトリニューアルしようとした時にそれまで動作していたJavaScript が動作しなくなる時があります。

特に更新が少なくてあまりWordPress のバージョンアップもしていない古いWordPress だと結構な確率で起こります。

いろいろな原因が考えられますが、まずはチェックしていただきたい箇所をご紹介させていただきます。

WordPress が読み込んでいる jQuery のバージョンが変わることによってJavaScript が動作しなくなることがある

WordPressはjQuery を読み込んでいるのですが、バージョンによって読み込んでいる jQuery のバージョンも上がっています。jQuery のバージョンが上がったことにより、前のバージョンでは使用できていた JavaScript が動作しなくなることがあります。

私の場合だとWordPress のバージョン4.9x作られていたサイトから最新のバージョンWordPress 5.７などにバージョンアップした場合に動作しないことが多いです。

原因としてはWordPress本体のjQueryにはコンフリクト対策の追記されたことにより、.noConflict() が追記されたからだそうです。

この記述があることで＄関数がjQueryで使えなくなっています。

どうすれば解決できるかというと、$ を jQuery とするだけです。

次のようなコードをであった場合

$(document).ready( function() {
$(#menu).toggle();
});

$(document).ready( function() {

$(#menu).toggle();

});

これを

jQuery(document).ready( function() {
jQuery(#menu).toggle();
});

jQuery(document).ready( function() {

jQuery(#menu).toggle();

});

と変更します。jQuery のバージョンが原因だった場合はこれで動作します。解決しない場合＄が複数あり、他に変更していない箇所があると動作しなかったりします。

全ての＄をjQuery に書き換えてみてください。それでも治らない場合は別の原因の可能性があるので条件を切り分けてチェックしていく必要があります。

WordPressのバージョンアップをしたらjQueryが動かなくなったときにまずは確認することをご紹介いたしました。

まずは$ を jQueryに変更してみてください。

それでも解決しない場合は他の原因を探してみてください。

最後まで読んでいただきありがとうございました。