How to Stop Loading WooCommerce .js (javascript) and .css files on all WordPress Posts/Pages?

Last updated
App Shah
Crunchify » WordPress Optimization and Tutorials » How to Stop Loading WooCommerce .js (javascript) and .css files on all WordPress Posts/Pages?
Stop Loading WooCommerce CSS and JavaScript on all Pages

How to Optimize WooCommerce to Load Scripts and CSS Conditionally only if required?

WooCommerce and Online Shopping – One of the best thing happened for all WordPress users 🙂

It’s been almost a year WordPress acquired WooCommerce and it’s been amazing journey. It seems, currently WooCommerce covers nearly ~40% of all online stores and that’s a big number. On Crunchify we wanted to have Online Digital Store and we have decided to give it a try.

WooCommerce comes as a simple plugin installation like any other plugin but it will be little bit heavy on resources.

Take a look a this:

WooCommerce adds total 13 new Database Tables

WooCommerce add total 13 new Database tables - Crunchify Analysis

WooCommerce loads 3 CSS files and 5 JavaScript files on Each page

// CSS files
woocommerce-layout.css
woocommerce-smallscreen.css
woocommerce.css

// JavaScript files
add-to-cart.min.js
jquery.blockUI.min.js
woocommerce.min.js
jquery.cookie.min.js
cart-fragments.min.js
WooCommerce Adds 3 CSS Files on Each WordPress Page
WooCommerce Adds 5 JavaScript Files on Each WordPress Page

Now as we know from Speed Optimization Goal, it’s absolutely not required to load all these 8 additional resources except cart, checkout or product page. Loading these 8 extra files may slow down your blog which may create some negative impact Google Search Engine Result (SERP) page.

Here is a quick tips to disable all above scripts except cart, checkout, my-account and product page.

//* Enqueue scripts and styles
add_action( 'wp_enqueue_scripts', 'crunchify_disable_woocommerce_loading_css_js' );

function crunchify_disable_woocommerce_loading_css_js() {

	// Check if WooCommerce plugin is active
	if( function_exists( 'is_woocommerce' ) ){

		// Check if it's any of WooCommerce page
		if(! is_woocommerce() && ! is_cart() && ! is_checkout() ) { 		
			
			## Dequeue WooCommerce styles
			wp_dequeue_style('woocommerce-layout'); 
			wp_dequeue_style('woocommerce-general'); 
			wp_dequeue_style('woocommerce-smallscreen'); 	

			## Dequeue WooCommerce scripts
			wp_dequeue_script('wc-cart-fragments');
			wp_dequeue_script('woocommerce'); 
			wp_dequeue_script('wc-add-to-cart'); 
		
			wp_deregister_script( 'js-cookie' );
			wp_dequeue_script( 'js-cookie' );

		}
	}	
}

Put above code into your theme’s functions.php file and save your changes.

And that’s it, you should be all good. Now try checking one more time on your blog home page and other posts and you shouldn’t see any of these files loaded on that page/post.

32 thoughts on “How to Stop Loading WooCommerce .js (javascript) and .css files on all WordPress Posts/Pages?”

  1. Thanks, but does not seem to work for me. Added to end of functions.php, cleared all caches, restart server. No errors, but woocommerce.css still on all pages including the home page.

    Reply
  2. Hey, I use WooCommerce blocks (categories) and has_product_category filter is not working. Anything I can do? Thanks.

    Reply
  3. Hi, would this script work on a pages with embedded checkout forms? Or how do I tell if the checkout page with the embedded form is considered is_checkout? I would not want the woocommerce scripts to be excluded from these types of checkout pages.

    Reply
    • Hi There – yeah. This code snippet works on all WooCommerece page and only disables scripts on non-woocommerece pages.

      Hope this helps. I would suggest to verify once you add code snippet. I agree, we don’t want to break WooCommerece Checkout functionality :).

      Reply
  4. Daaang this worked easily! I added it to one of my affiliate sites that doesn’t use carts and shipping anyway, it just has Amazon redirects to the product page. It took off 3 seconds and 10 requests. Thank you!

    Reply
  5. Hi! Thanks for the tips! This code worked fine with WP 5.5 and WC 4.4, but as I wanted to go further with some WC and Elementor dependents, I had to dequeue scripts or styles also with

    add_action( 'elementor/frontend/after_enqueue_scripts', function() {
    wp_dequeue_script( 'jet-woo-builder' );
    } );

    Reply
  6. Dummy question: If I disable the scripts mentioned by you, will I have no problem with the way my website will look?

    Reply
    • Hi Marcel – there will be for sure if you are using WooCommerce on your site. But sometimes there are so many theme developers include WooCommerce themes even if you don’t use that. In that case I would suggest to disable loading all WooCommerce JavaScripts and CSS related to it.

      Hope this helps.

      Reply
  7. As of June 2019 and WP 5.2.x, this does not seem to work. I copied and pasted the code to my functions.php file and jQuery gets disabled and my site of course does not load correctly. I comment the modification out, and the site works fine. Any ideas?

    Error displayed in console: “my_script.js?ver=4.1C:26 Uncaught ReferenceError: jQuery is not defined”

    Reply
    • Hi Karl – we are still using this on our site without any issue.

      What issue are you facing at your end?

      Reply
  8. Hello 🙂

    I just installed WP, Woo and Storefront with child theme. I just can’t make this work. I’ve tried 10 examples. Does Storefront block it somehow?

    Reply
    • Hi Kevin. Thanks for reaching out. Ideally WordPress hook should honored that. I never played with Storefront theme. So sorry i’m not sure.

      Reply
  9. Hello, I followed you example and now my site wont load anymore. how do I get my site back to loading again.
    Thanks

    Reply
    • Hi Agbe – what do you mean your site doesn’t load? Make sure you don’t have any typo in functions.php file.

      Can you share your functions.php file? I’ll try debug further.

      Reply
  10. It does not work with WC 3.0 do you know a solution to do this in WC 3.0? It worked perfectly before upgrading.

    For example:
    wp_dequeue_script(‘jquery-cookie’); Worked before 3.0.

    Best regards.

    Reply

Leave a Comment