質問: ### 前提・実現したいこと ワードプレスでjQueryプラグインvalidationEnginを使用し、リアルタイムバリデーションをしようとしています。 コンタクトフォーム7にvalidationEnginを使用しております。 page-contact.phpに下記コードを記載してvalidationEnginを読み込んでいます ### ソースコード ``` ``` ### 発生している問題・エラーメッセージ ``` Uncaught TypeError: jQuery(...).validationEngine is not a function・・・・ ``` 上記のエラーが出てしまい、validationEnginが動いてくれません。 validationEnginを読み込んでいないようです。 wp-includes/js/jquery/jquery.js?ver=1.12.4-wp 上記のようにjqueryは読み込めていることを確認しています。 ### 試したこと functions.phpに ``` function validation_scripts() { wp_enqueue_style( 'validationEngine.jquery.css', 'https://cdnjs.cloudflare.com/ajax/libs/jQuery-Validation-Engine/2.6.4/validationEngine.jquery.min.css', array(), '2.6.4', 'all'); wp_enqueue_script( 'jquery.validationEngine-ja.js', 'https://cdnjs.cloudflare.com/ajax/libs/jQuery-Validation-Engine/2.6.4/languages/jquery.validationEngine-ja.min.js', array('jquery'), '2.6.4', true ); wp_enqueue_script( 'jquery.validationEngine.js', 'https://cdnjs.cloudflare.com/ajax/libs/jQuery-Validation-Engine/2.6.4/jquery.validationEngine.min.js', array('jquery'), '2.6.4', true ); } add_action( 'wp_enqueue_scripts', 'validation_scripts' ); ``` のように記載しましたが読み込んでくれませんでした。CSSファイルのみ読み込めています。jsファイルが読み込めません。 またpage-contact.phpにscriptタグで下記のように読み込むとリアルタイムバリデーションは動きますが、jqueryが重複してしまい問い合わせフォームからメッセージ送信ができませんでした。 ``` ``` また、wp_deregister_script()を使用しjqueryの読み込みを中止、wp_enqueue_scriptにてCDNからjqueryの読み込みを行いましたが、ダメでした。 ### 補足情報(FW/ツールのバージョンなど) ワードプレスのバージョン:5.3 使用テーマ:lightning2.6.1(子テーマを使用) ※最新版にアップデートしてしまうと表示が崩れてしまうため古いバージョンを使用中 コンタクトフォーム7のバージョン:5.1.6 どうやって解決して良いかわからずお手上げです。
回答: とりあえず、気になった点を記載しますので、確認してみてください。 page-contact.php の中に wp_enqueue_script() 記載しているのでしょうか? 各テンプレートファイルの中に `wp_enqueue_script()` 等を記載して読み込む場合は、`wp_enqueue_script()` の記載場所によっては、実行タイミングの問題で、`wp_enqueue_script()` で登録した script のタグ等が出力されない(=実行されない)可能性があります。 各テンプレートファイルの中で記載する場合は、`wp_head()` やすべての画面出力の前に記載するのが確実です。 可能であれば、各テンプレートファイルではなく functions.php で、`wp_enqueue_scripts` や `wp_head` フックに記載するのが確実と思います。 以下は、よくある指摘内容ですが... Web ブラウザのデベロッパーツールで、Webブラウザに出力された HTML を確認した場合、必要なタグが全部出力されていて、正しい順番で各スクリプトが読み込まれているでしょうか? たとえば、WordPress のテーマによっては、jQuery をフッタで読み込んでいるものがありますが、読み込む順番が異なったり、複数バージョンが重複して読み込まれていたりしないでしょうか?