Contact Form 7 Speed up – WordPress

Contact form 7 is probably the most popular free contact form plugin for WordPress. But you need to take one additional step after installing it, to make sure it doesn’t slow down your WordPress website …

optimize wordpress contact form 7 speed up

Contact form 7 is probably the most popular free contact form plugin for WordPress. But you need to take one additional step after installing it, to make sure it doesn’t slow down your WordPress website or store.

We’ll go over the why, the problem, the fix and why should you care. Read on.

Why and how do we speed up Contact Form 7 for WordPress?

The why: like any plugin, it loads some CSS and some JS in order to work and look good.

The problem: it loads those files everywhere! Even on pages where you don’t have a contact form added.

How to fix Contact Form 7 adding js and css everywhere

1. Find your contact page or the page where you want the form to work’s slug. For example, in the URL example.com/contact, the slug is contact .

2. Replace the word contact in the code below with your slug. It could probably even be the same. (line 5)

add_filter( 'wpcf7_load_js', '__return_false' );
add_filter( 'wpcf7_load_css', '__return_false' );
add_action('wp_enqueue_scripts', 'load_wpcf7_scripts');
function load_wpcf7_scripts() {
  if ( is_page('contact') ) {
    if ( function_exists( 'wpcf7_enqueue_scripts' ) ) {
      wpcf7_enqueue_scripts();
    }
    if ( function_exists( 'wpcf7_enqueue_styles' ) ) {
      wpcf7_enqueue_styles();
    }
  }
}

3. Add this code to your theme’s function.php file, at the end. Save and done! Contact form 7 will only load it’s CSS/JS files only on that page.

note: don’t forget to clear your cache if you use a caching plugin.

What that code does, is basically preventing the plugin from loading it’s files, unless the page we’re on is the one you specified.

What if you have the contact form on multiple pages? Or multiple contact forms?

Easy. Just replace line 5 in the code above with this:

if ( is_page( array( 'about-us', 'contact' ) ) ) {

The code above assumes the slugs of the pages you want the Contact Form 7 plugin to work are: about-us and contact.

Why should you care?

A bloated page, loads slower. So having additional CSS and JS files that you don’t actually use load on every page, will slow down your website or store.

And considering this Contact Form 7 speed up will take you less than 3 minutes and it’s free… you should care and do it asap. Your visitors deserve a fast loading website or store.

That’s it!

And that’s about it! Contact Form 7 is a great plugin! And loading it only when required will help you keep those loading times as low as possible.

And I get it. Some might be tempted to search for alternatives. But hear me out: if it does all you need, it’s simple enough to use (and it is), and now its fast… why bother? Focus your attention where its needed the most.

And if this small article was useful, share it! It helps me and maybe other people by making their websites faster!

Thanks for reading!