Override WooCommerce Frontend Javascript

1 Views

Can someone guide me as to what is the proper method of overriding WooCommerce core Javascript files, specifically frontend files. I have not found any documentation on this and looking at the code, the path to the frontend script files is hard coded in the plugin so I doubt that placing an assets folder in my theme will do anything.

What is the cleanest way to to this so that I can load a file located in my theme dir?

Read More

Thanks

Post Views: 1

Related posts

Leave a Reply

3 comments

  1. I had the same problem except with add-to-cart.js. Simple solution is to DEQUEUE the woocommerce script and ENQUEUE your replacement. In my case I added the following to my functions.php:

    wp_dequeue_script('wc-add-to-cart');
wp_enqueue_script( 'wc-add-to-cart', get_bloginfo( 'stylesheet_directory' ). '/js/add-to-cart-multi.js' , array( 'jquery' ), false, true );

    You would want to DEQUEUE the ‘wc-add-to-cart-variation’ script. I don’t think you have to ENQUEUE with the same name, but I couldn’t see a reason not to.

    Hope this helps.

    If you’re using WordPress Version 4.0.1 and WooCommerce Version 2.2.10. You can use the following scripts:

    
wp_deregister_script('wc-add-to-cart');
wp_register_script('wc-add-to-cart', get_bloginfo( 'stylesheet_directory' ). '/js/add-to-cart-multi.js' , array( 'jquery' ), WC_VERSION, TRUE);
wp_enqueue_script('wc-add-to-cart');

  2. WooCommerce loads frontend scripts and styles in class-wc-frontend-scripts.php file, and there can be found how the scripts are registered, enqueued, localized and dependencies.

    The preferred place to enqueue scripts in WordPress is the wp_enqueue_scripts action hook, because that is the moment after WordPress is fully loaded but before any output is made. And also I like to enqueue all my related script and styles in one section of code.

    When you want to completely remove some scripts, calling either wp_deregister_script() or wp_dequeue_script() is enough. But sometimes if want to make some changes and leave the existing dependencies, variables and localization there is a problem because plugins are loaded before themes. So enqueue functions will not work as you would expect. Simple wp_dequeue_script() => wp_enqueue_script() will not work, wp_deregister_script() => wp_register_script() will work, but localized data will be lost.

    This can be solved by working directly with $wp_scripts global object that contains and manages all the scripts loaded through wp_enqueue_script() or registered with wp_register_script():

        add_action( 'wp_enqueue_scripts', 'load_theme_scripts' );

    function load_theme_scripts() {
        global $wp_scripts; 
        $wp_scripts->registered[ 'wc-add-to-cart' ]->src = get_template_directory_uri() . '/woocommerce/js/wc-add-to-cart.js';
    }

  3. Add this section to your function.php

    function themeslug_enqueue_script() {
wp_enqueue_script( 'add-to-cart-variation', get_bloginfo( 'url' ). '/wp-content/plugins/woocommerce/assets/js/frontend/add-to-cart-variation.js', false );
}
add_action( 'wp_enqueue_scripts', 'themeslug_enqueue_script' );