Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Fixing Cart Widget showing the incorrect item when using WPML with WooCommerce, by forcing cart widget to refresh on every page load.
/** Break html5 cart caching */
add_action('wp_enqueue_scripts', 'cartcache_enqueue_scripts', 100);
function cartcache_enqueue_scripts()
{
wp_deregister_script('wc-cart-fragments');
wp_enqueue_script( 'wc-cart-fragments', get_template_directory_uri() . '/cart-fragments.js', array( 'jquery', 'jquery-cookie' ), '1.0', true );
}
/** Modified cart-fragments.js script to break HTML5 fragment caching. Useful with WPML when switching languages **/
jQuery(document).ready(function($) {
/** Cart Handling */
$supports_html5_storage = ( 'sessionStorage' in window && window['sessionStorage'] !== null );
$fragment_refresh = {
url: woocommerce_params.ajax_url,
type: 'POST',
data: { action: 'woocommerce_get_refreshed_fragments' },
success: function( data ) {
if ( data && data.fragments ) {
$.each( data.fragments, function( key, value ) {
$(key).replaceWith(value);
});
if ( $supports_html5_storage ) {
sessionStorage.setItem( "wc_fragments", JSON.stringify( data.fragments ) );
sessionStorage.setItem( "wc_cart_hash", data.cart_hash );
}
$('body').trigger( 'wc_fragments_refreshed' );
}
}
};
//Always perform fragment refresh
$.ajax( $fragment_refresh );
/* Cart hiding */
if ( $.cookie( "woocommerce_items_in_cart" ) > 0 )
$('.hide_cart_widget_if_empty').closest('.widget_shopping_cart').show();
else
$('.hide_cart_widget_if_empty').closest('.widget_shopping_cart').hide();
$('body').bind( 'adding_to_cart', function() {
$('.hide_cart_widget_if_empty').closest('.widget_shopping_cart').show();
} );
});
@hyyan
Copy link

hyyan commented Mar 18, 2015

Great , works for me

@dendeffe
Copy link

dendeffe commented Jun 10, 2015

There should be some way from within WPML to invalidate the cart a bit more selectively. But for now, a solution like this seems to work.

@funique
Copy link

funique commented Nov 17, 2015

If there is anybody here who would be kind enough to explain how to implement this to a beginner, I would greatly appreciate it, thank you :)

@mrkariox
Copy link

mrkariox commented Aug 7, 2017

@funique

Add code:

/** Break html5 cart caching */
	add_action('wp_enqueue_scripts', 'cartcache_enqueue_scripts', 100);

	function cartcache_enqueue_scripts()
	{
		wp_deregister_script('wc-cart-fragments');
		wp_enqueue_script( 'wc-cart-fragments', get_template_directory_uri()  . '/cart-fragments.js', array( 'jquery', 'jquery-cookie' ), '1.0', true );
	}

to yours "functions.php" in template directory. (/wp-content/themes/your-theme/functions.php)

Then in your template directory (/wp-content/themes/your-theme/) make file "cart-fragments.js" with code:

/** Modified cart-fragments.js script to break HTML5 fragment caching. Useful with WPML when switching languages **/
jQuery(document).ready(function($) {

    /** Cart Handling */
    $supports_html5_storage = ( 'sessionStorage' in window && window['sessionStorage'] !== null );

    $fragment_refresh = {
        url: woocommerce_params.ajax_url,
        type: 'POST',
        data: { action: 'woocommerce_get_refreshed_fragments' },
        success: function( data ) {
            if ( data && data.fragments ) {

                $.each( data.fragments, function( key, value ) {
                    $(key).replaceWith(value);
                });

                if ( $supports_html5_storage ) {
                    sessionStorage.setItem( "wc_fragments", JSON.stringify( data.fragments ) );
                    sessionStorage.setItem( "wc_cart_hash", data.cart_hash );
                }

                $('body').trigger( 'wc_fragments_refreshed' );
            }
        }
    };

    //Always perform fragment refresh
    $.ajax( $fragment_refresh );

    /* Cart hiding */
    if ( $.cookie( "woocommerce_items_in_cart" ) > 0 )
        $('.hide_cart_widget_if_empty').closest('.widget_shopping_cart').show();
    else
        $('.hide_cart_widget_if_empty').closest('.widget_shopping_cart').hide();

    $('body').bind( 'adding_to_cart', function() {
        $('.hide_cart_widget_if_empty').closest('.widget_shopping_cart').show();
    } );
});

BTW. Thanks a lot for that working code!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment