先日WordPressを更新したらjQueryが動かなくなっていて、いつからだろうと思ってバックアップを復元したら結構前からだったことが発覚しました。なんとか解決したので覚え書きをまとめます。
①jQueryのファイルが読み込まれているか確認
まずは
・jQueryプラグイン
のファイルが読み込まれているか確認しましょう。
jQueryプラグインのファイルが読み込まれていても、
・jQuery本体を二重に読み込んでしまっている
ということも多々あります。
以前はheader.phpにjQuery本体やその他プラグインのファイルが読み込まれていることが多かったですが、最近ではfunctions.phpで管理することが推奨されています。
functions.phpでこんな記述があるのを探してみて下さい。
wp_enqueue_script( 'jquery' );
wp_enqueue_script( '名前', get_stylesheet_directory_uri() . '/js/名前.js');wp_enqueue_style( '名前', get_stylesheet_directory_uri() . '/css/名前.css' );
②プラグインのファイルが設置されていることを確認
jQueryプラグインファイルをダウンロードし、自分のサーバーに設置している場合は、きちんと入っているか確認しましょう。
FTPを確認して、JSファイルやCSSファイルが入っていることが確認できればOKです。
CDNなど、外部ファイルをリンクだけで読み込んでいる場合は確認しなくて大丈夫です。
※wp_enqueue_script(‘jquery’, ‘http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js’, ‘1.10.1’);
こんな感じで、外部リンクを参照していたらCDNを使用している証拠です。
③jQueryを実際に使用するためのコードが記載してあることを確認
これはjQuery本体、jQueryプラグインのファイルの後でなければなりません。
javascriptやjQueryを動かすためのコードは、前はfooter.phpに書かれていることが多かったけど最近はfunctions.phpが多いのかなと思います。
今回私がミスしたのはここでした。functionsにも記載がないなぁと思っていたら、jQueryは自作のJSファイルに追加していたみたいです。別の人が結構前にjQueryを停止していたとのことでした。
④③の自作のファイル内に書いたコードの書き方が間違っていない
ほとんどはコードの記述ミスな気がします。
Google Chromeのブラウザを使っている場合は、「F12」で要素の検証を開き、該当箇所のコードを見て、classやIDをjQueryに指定しましょう。
コメント