Load Contact Form 7 CSS and JS on Form Pages Only

When optimizing the performance of your WordPress site you'll want to reduce unnecessary HTTP requests. Use this code in your functions.php to load Contact Form 7 CSS and JS only when a form is present on the page.

There’s no need to have your visitors load the CSS and JS for Contact Form 7 if they’re not using the Contact Form. Use this code in your functions.phpto restrict loading of CF7 CSS and JS to only the ID specified. Change the number 55 to match the ID of the page you use for your contact form.

/* DONT LOAD CONTACT FORM PAGE 7 SITE WIDE */
add_filter( 'wpcf7_load_js', '__return_false' );
add_filter( 'wpcf7_load_css', '__return_false' );
add_action( 'genesis_before_loop', 'cf7_contact_page_only', 1);
function cf7_contact_page_only() {
  if ( is_page( 55 ) ) { 
       if ( function_exists( 'wpcf7_enqueue_scripts' ) ) {
        wpcf7_enqueue_scripts();
    }
    if ( function_exists( 'wpcf7_enqueue_styles' ) ) {
        wpcf7_enqueue_styles();
    } 
  }
}

Hire a WordPress Expert

Get hourly and project based theme customization, theme tweaks, and development help from world-class WordPress developers at Codeable. If you’re in Kelowna and need a custom website for your business visit our Kelowna Web Design page now to get started.