Contact Form 7のJavaScriptとCSSを必要なページでのみ読み込む方法

• シェアしてね♪
• Tweet
• 
• 

---

• 
  一式98,000円～の格安プランをご用意！Web制作お任せください！

• Tweet
• 
• 

お問い合わせフォームを簡単に設置することができるContact Form 7。非常に便利なプラグインですね。

Contact Form 7をインストールすると、すべてのページでContact Form 7用のJavaScriptとCSSが読み込まれるようになります。プラグインの挙動としては致し方ない部分ではあるのですが、フォームを設置していないページでは必要ない読み込みが発生してしまいます。それによってページの表示速度にも影響しますね。

そこで今回は、必要なページでのみContact Form 7のJavaScriptとCSSを読み込むようにする方法をご紹介したいと思います。

Contact Form 7のJavaScriptとCSSを必要なページでのみ読み込む方法

適用しているテーマのfunctions.phpに以下を追加します。

//Contact Form 7のJavaScriptとCSSの読み込みを停止
function wpcf7_js_css_disable() {
  add_filter( 'wpcf7_load_js', '__return_false' );
  add_filter( 'wpcf7_load_css', '__return_false' );
}
add_action( 'after_setup_theme', 'wpcf7_js_css_disable' );

//特定の固定ページでのみJavaScriptとCSSを読み込む
function wpcf7_js_css_enable() {
  if( is_page('contact') ) { //ページの指定
    if ( function_exists( 'wpcf7_enqueue_scripts' ) ) {
      wpcf7_enqueue_scripts();
    }
    if ( function_exists( 'wpcf7_enqueue_styles' ) ) {
      wpcf7_enqueue_styles();
    }
  }
}
add_action( 'wp_enqueue_scripts', 'wpcf7_js_css_enable' );

「is_page( ‘contact’ )」の部分で、JavaScriptとCSSを読み込むページを指定しているので、自サイトに合わせてスラッグを変更してください。

あとがき

Contact Form 7のデフォルトの機能に追加してくれたらうれしいんですけどね(^^)

少しでも負荷を抑えてサイトの読み込み速度を向上させたい場合は、ぜひお試しください。