WordPressでContact Form 7のスクリプトとスタイルを条件付きで読み込む方法

WordPressサイトのパフォーマンスを向上させるために、必要なページでのみスクリプトやスタイルを読み込むことは非常に有効です。これにより、不必要なHTTPリクエストを減らし、他のページの読み込み速度を向上させることができます。このガイドでは、Contact Form 7のスクリプトとスタイルをお問い合わせページでのみ読み込む方法を紹介します。

手順ガイド

1. お問い合わせページのスラッグを確認する まず、お問い合わせページのスラッグを確認します。スラッグはURLの特定のページを識別する部分です。例えば、お問い合わせページのURLが https://yourwebsite.com/contact であれば、スラッグは contact です。
2. 条件付き読み込みの関数を追加する 次に、以下のコードをテーマの functions.php ファイルに追加します。このコードは、現在のページがお問い合わせページかどうかをチェックします。もしお問い合わせページであれば、必要なContact Form 7のスクリプトとスタイルを読み込みます。そうでない場合は、それらを読み込みから除外します。

   function conditional_wpcf7_scripts() {
       if (is_page('contact')) { // 'contact'をお問い合わせページのスラッグに置き換えてください
           // Contact Form 7のスクリプトとスタイルを再登録して読み込む
           if ( function_exists( 'wpcf7_enqueue_scripts' ) ) {
               wpcf7_enqueue_scripts();
           }
           if ( function_exists( 'wpcf7_enqueue_styles' ) ) {
               wpcf7_enqueue_styles();
           }
       } else {
           // Contact Form 7のスクリプトとスタイルを読み込みから除外
           wp_dequeue_script('contact-form-7');
           wp_dequeue_script('wpcf7-recaptcha');
           wp_dequeue_script('google-recaptcha');
           wp_dequeue_script('swv-js');

           wp_dequeue_style('contact-form-7');
       }
   }
   add_action('wp_enqueue_scripts', 'conditional_wpcf7_scripts', 99);

3. コードの説明

• if (is_page('contact')) { ... }:
  • 現在のページがスラッグ ‘contact’ のページかどうかをチェックします。この部分を、お問い合わせページのスラッグに置き換えてください。
• wpcf7_enqueue_scripts() と wpcf7_enqueue_styles():
  • これらの関数はContact Form 7のスクリプトとスタイルを読み込みます。function_exists で関数が存在するか確認し、存在する場合のみ実行します。
• wp_dequeue_script('contact-form-7'):
  • Contact Form 7のメインスクリプトを読み込みから除外します。
• wp_dequeue_script('wpcf7-recaptcha'):
  • Contact Form 7で使用されるreCAPTCHAスクリプトを読み込みから除外します。
• wp_dequeue_script('google-recaptcha'):
  • GoogleのreCAPTCHAスクリプトを読み込みから除外します。
• wp_dequeue_script('swv-js'):
  • Contact Form 7関連のJavaScriptファイルを読み込みから除外します。
• wp_dequeue_style('contact-form-7'):
  • Contact Form 7のスタイルシートを読み込みから除外します。
  これらの wp_dequeue_script と wp_dequeue_style の関数は、特定のスクリプトやスタイルの読み込みをキャンセルするために使用します。これにより、特定のページ以外ではこれらのリソースが読み込まれず、サイトのパフォーマンスが向上します。

3. カスタマイズ

• is_page('contact') の ‘contact’ 部分を、お問い合わせページのスラッグに変更します。

まとめ

このコードを functions.php に追加することで、Contact Form 7のスクリプトとスタイルが必要なページでのみ読み込まれ、他のページのパフォーマンスが向上します。お問い合わせページ以外では、これらのスクリプトとスタイルが読み込まれないため、無駄なリソースの使用を避けることができます。