Refresh / update minicart with AJAX in Woocommerce

21,643

Solution 1

The filter hook woocommerce_add_to_cart_fragments is missing from your function…

To get it work, it should be:

add_filter( 'woocommerce_add_to_cart_fragments', 'header_add_to_cart_fragment', 30, 1 );
function header_add_to_cart_fragment( $fragments ) {
    global $woocommerce;

    ob_start();

    ?>
    <a class="cart-customlocation" href="<?php echo esc_url(wc_get_cart_url()); ?>" title="<?php _e('View your shopping cart', 'woothemes'); ?>"><?php echo sprintf(_n('%d item', '%d items', $woocommerce->cart->cart_contents_count, 'woothemes'), $woocommerce->cart->cart_contents_count);?> - <?php echo $woocommerce->cart->get_cart_total(); ?></a>
    <?php
    $fragments['a.cart-customlocation'] = ob_get_clean();

    return $fragments;
}

Code goes in function.php file of your active child theme (or active theme). Untested.

Solution 2

2022 Solution

Woocommere display realtime counter and minicart with ajax

First display your counter and mini cart contents in where you want like header.php or etc like this:

<div class="basket-item-count">
  <span class="cart-items-count">
  <?php
    echo WC()->cart->get_cart_contents_count();
  ?>
</span>
</div>

This will be display standalone counter that you want to have beside cart icon.

<div class="widget_shopping_cart_content">
   <?php
     echo woocommerce_mini_cart();
   ?>
</div>

This will be display mini cart items. by default woocommerce will be update your mini cart items in fragments but you need to append your counter to this fragment like below, so add this snippet to your functions.php:

add_filter( 'woocommerce_add_to_cart_fragments', 'cart_count_fragments', 10, 1 );

function cart_count_fragments( $fragments ) {
    $fragments['div.basket-item-count'] = '<div class="basket-item-count"><span class="cart-items-count">' . WC()->cart->get_cart_contents_count() . '</span></div>';
    return $fragments;
}

Note that class names are important and it will be update counter with cart-items-count class.

Share:
21,643
tobiasg
Author by

tobiasg

Updated on June 05, 2022

Comments

  • tobiasg
    tobiasg almost 2 years

    I’m trying to add this code to my WooCommerce setup that adds a shopping cart link wherever I put the PHP and then updates it upon changing items in the cart with AJAX: https://docs.woocommerce.com/document/show-cart-contents-total/

    Here are the snippets:

    HTML - PHP:

    <a class="cart-customlocation" href="<?php echo wc_get_cart_url(); ?>" title="<?php _e( 'View your shopping cart' ); ?>"><?php echo sprintf ( _n( '%d item', '%d items', WC()->cart->get_cart_contents_count() ), WC()->cart->get_cart_contents_count() ); ?> - <?php echo WC()->cart->get_cart_total(); ?></a>
    

    In functions.php file:

    function woocommerce_header_add_to_cart_fragment( $fragments ) {
        global $woocommerce;
    
        ob_start();
    
        ?>
        <a class="cart-customlocation" href="<?php echo esc_url(wc_get_cart_url()); ?>" title="<?php _e('View your shopping cart', 'woothemes'); ?>"><?php echo sprintf(_n('%d item', '%d items', $woocommerce->cart->cart_contents_count, 'woothemes'), $woocommerce->cart->cart_contents_count);?> - <?php echo $woocommerce->cart->get_cart_total(); ?></a>
        <?php
        $fragments['a.cart-customlocation'] = ob_get_clean();
        return $fragments;
    }
    

    But the AJAX is not working. Is the second snippet all I need to add to the functions.php?

    It feels like I should call the function and not just define it?

    Or do I need to activate AJAX in general in some way to get it to work?

  • tobiasg
    tobiasg almost 6 years
    Thanks That worked! It was missing in the example from the WooCommerce site.
  • tobiasg
    tobiasg almost 6 years
    Just a follow up question. Is it possible to get the function to rerun when I refresh the page? I have PolyLang installed I change the "items" keywords with variables depending on if the site is set to swedish or english. It seems like the latest AJAX called is somehow cached, so changing the language of the site doesn't change the keywords in the string that the header_add_to_cart_fragment function returns. If I place a product in the cart, the keyword changes. But if I then change to another language, the keyword is still in the language that was activated when I added the product.
  • LoicTheAztec
    LoicTheAztec almost 6 years
    @tobiasg Sorry but I never use Polylang as I always use WPML, so I can't help on this.
  • Ravi Patel
    Ravi Patel about 2 years
    Cart page : Cart updated event on not work.