You can stop the Contact Form 7 plugin’s script and stylesheet from loading on every page of your WordPress blog. While the plugin is a great one to install, since it makes creating contact forms easy, you probably don’t want to load the script and stylesheet on every page. For those that one to get every ounce of performance out of their blog, you definitely don’t want those two resources to load each time.
The good news is that it is easy to only load the plugin’s resources on a specific page of your WordPress blog. By simply creating a few lines of code in the functions.php file of your current theme, you can control when scripts and stylesheets are loaded for many plugins that you have installed. Let’s look at how to do this for the Contact Form 7 plugin.
Deregistering Scripts and Stylesheets
Many plugins use the wp_enqueue_script WordPress function to load supporting Javascript files. The wp_enqueue_style function may be used to load any stylesheets used by the plugin. Now, not all plugins use these two functions as they may use PHP’s “echo” command instead. If a plugin does use the WordPress functions, you can then use two other WordPress functions to unregister the resources when they aren’t needed. The two WordPress functions are: wp_deregister_script and wp_deregister_style.
To unregister either a stylesheet or script you will need their handle, which was created when the wp_enqueue_script or wp_enqueue_style was called. You can easily find this by searching through the plugin’s files until you find where the stylesheet or script is registered.
For the Contact Form 7 plugin, the following lines of code are used to register the script and stylesheet:
wp_enqueue_style( 'contact-form-7', wpcf7_plugin_url( 'styles.css' ), array(), WPCF7_VERSION, 'all' );
The code highlighted in green shows the two handles that will be used to deregister the resources. Next we must add the code needed to prevent the script and stylesheet from loading for each page.
Deregister the Contact Form 7 Script and Stylesheet
To only load the Contact Form 7 Javascript and stylesheet on one page, add the following PHP code to your functions.php file:
function my_deregister_javascript() {
if ( !is_page('Contact') ) {
wp_deregister_script( 'contact-form-7' );
}
}
add_action( 'wp_print_styles', 'my_deregister_styles', 100 );
function my_deregister_styles() {
if ( !is_page('Contact') ) {
wp_deregister_style( 'contact-form-7' );
}
}
The above code will check to see if the page loaded isn’t the “Contact” page, and if it isn’t, then the script and stylesheet used by the Contact Form 7 plugin are deregistered. Simply replace the page name that I have in the above code with the page that has your contact form. Of course, you can extend the if statement to include multiple pages as well.
I have used similar code to prevent other unnecessary scripts and stylesheets from load on every page from other plugins. You may not be able to disable some of the scripts or stylesheets, but if you can get most of them, your blog should load up quicker.
If you liked reading this post, consider following Technically Easy through the following:
on August 18, 2010 at 11:04 am
Nice hack. Will definitely help reduce the page load time of other pages that ain’t the contact page.
I’ll be looking at applying this to some plug-ins on my site that are supposed to be loaded only on posts and not site wide
Udegbunam Chukwudi recently posted…Free Blog Setup Services For Five Grab Yours NOW!
on August 18, 2010 at 9:52 pm
I’ve been doing the same – reducing when plugin scripts run to avoid any unnecessary site wide loading.
on August 19, 2010 at 9:13 am
It just added the hack to my blog and it works. Any ideas how to add it to other pages like my Advertise Here page where I also have the contact form showing?
Thanks man
Udegbunam Chukwudi recently posted…Show Adsense To Search Engine Visitors With JavaScript
on August 19, 2010 at 9:33 am
You can use the ID, page title, or the post slug of the page in an array, such as:
// Use the post slug
if ( !is_page(array('advertise-here', 'contact') ) ) {
wp_deregister_script( 'contact-form-7' );
}
or
// Use the page title
if ( !is_page(array('Advertise Here', 'Contact') ) ) {
wp_deregister_script( 'contact-form-7' );
}
on August 19, 2010 at 10:02 am
It’s not working. It keeps messing up my functions.php : Parse error: syntax error, unexpected ‘{‘ in [path to file]/functions.php on line 120
Thanks anyway
Udegbunam Chukwudi recently posted…Blogging At A Glance With Karo Itoje
on August 19, 2010 at 11:09 am
Sorry, I was missing a “)” in the if statement. I corrected the code I gave you to include the missing character.
on August 19, 2010 at 4:22 pm
Thanks man. Not to worry anyway. I’ve combined my advertise and contact page in one
P.S: I sent you an email regarding editing my previous comment. Please check you inbox and edit the comment. Thanks man.
Udegbunam Chukwudi recently posted…EzBlogSetup Service Is Now LIVE & OPEN For Orders!
on August 19, 2010 at 8:07 pm
Your previous post has been modified as requested.
on August 20, 2010 at 5:36 am
Thanks a million man
Udegbunam Chukwudi recently posted…StrictlyOnlineBiz’s Top Blog Posts Of The Week 24
on August 20, 2010 at 12:07 pm
No problem.
on August 19, 2010 at 9:17 am
Thanks for this tip Paul. But I want to restrict the page numbers plugin too like this, to make that load on the index of my blog what’s the name that I should insert ? plain index.php ? or something else ?
Mani Viswanathan recently posted…The ingenious “Plan B” Approach – Secondary Calls-To-Action
on August 19, 2010 at 9:40 am
Here are two options that enable a script for the home page only, or disable the script for the home page only:
// Removes script from all but the home page of your blog
if ( !is_front_page() ) {
wp_deregister_script( '[script handle]' );
}
or
// Removes script from the home page of your blog
if ( is_front_page() ) {
wp_deregister_script( '[script handle]' );
}
on August 25, 2010 at 1:08 am
This is a great looking theme BTW. What are you using? I tried to check your .css file, but you’ve removed comments and compressed it.
From following the comment thread, does this hack work? I want to confirm before I give this a try. Loading java for contact form 7 on every page is pretty annoying.
Thanks,
Jarret
Jarret recently posted…Commentluv enabled Health and Fitness blog
on August 25, 2010 at 2:18 pm
I designed the theme myself, and the compressed CSS file is done by the W3 Total Cache plugin – the best cache plugin I have used.
I haven’t had any issues with the hack. It does load the scripts on the contact page without a problem, but prevents it from loading on the remaining pages.
on August 29, 2010 at 10:49 pm
1. I didn’t know Contact Form was loading on every page.
2. Thanks for this little rundown
3. Pages are loading even quicker now!
on August 30, 2010 at 8:04 am
I’m glad your pages are loading faster now that the Contact Form 7 script only loads when it needs to.
on November 2, 2010 at 2:37 am
Thanks for the tip!
I used Contact Form 7 in my client’s site, will definitely try this tut.
I reckon the js of contact form 7 is separated if we use pagespeed to measure how fast our sites load.
Kimi recently posted…Free Thesis 18 Skins WordPress
on November 2, 2010 at 8:06 am
Yes, it would be counted as a separate file by any speed measuring program.
on November 22, 2010 at 7:38 am
I used your code and it’s work, but I want to optimize my page: on the contact page, contact-form load his script (script.js), jquery and jquery again from wp-includes. My theme already include jquery, so I would to load only script.js.
If I use wp_deregister_script( ‘jquery’ ); it deregister all three scripts, and if I edit wp_enqueue_script( ‘contact-form-7′, wpcf7_plugin_url( ‘scripts.js’ ),
array( ‘jquery’, ‘jquery-form’ ), WPCF7_VERSION, $in_footer ); removing ‘jquery’ it doesn’t change anything.
Any ideas?
ps: sorry for my english
on November 22, 2010 at 7:48 am
Sorry, I just realized that one script is jquery.form and not jquery, so I suppose I need it. The problem is only the jquery file from wp-includes.
on November 22, 2010 at 11:48 am
Ok, I need to cancel the jquery dependence also from wp_register_script( ‘jquery-form’…
Ciao!
on April 22, 2011 at 2:29 pm
Exactly what I was desperately looking for!
It works great, thank you for this little hack which speeds up pages.
on April 25, 2011 at 8:31 am
No problem. I’m glad you found what you were looking for.
on October 6, 2011 at 12:36 am
Interesting. Thanks a lot for sharing this. It’s a very informative post.
Andrew Walker recently posted…goHastings.com Coupon Code
on October 10, 2011 at 3:57 am
Thanks for sharing this great piece of code. I always wondered on how to this with contact form 7. Thanks.
Peter recently posted…conference call
on October 18, 2011 at 4:24 am
Lovely fix, I’ve been searching for this fix for a quite while now.
kristeen recently posted…autoverzekering berekenen
on October 18, 2011 at 8:15 am
I’m glad I could help you solve a problem.
on December 5, 2011 at 12:15 am
This is exactly what I need Paul, this is such a helpful one. I use to have contact page only so that I can identify frequently those person who wants to contact me.
Chong Davel recently posted…Pet Food Brands
on December 5, 2011 at 8:16 am
No problem, Chong.