Comment mettre à jour dynamiquement le nombre d’articles du panier d’en-tête WooCommerce à l’aide d’Ajax ?

Nombre d'articles du panier d'en-tête Ajaxify dans Woocommerce

Aperçu :

Dans Woocommerce, mise à jour du nombre d'articles du panier d'en-tête lors de l'ajout /La suppression d'éléments peut être réalisée sans rechargement de page à l'aide d'Ajax.

Solution :

1. Balisage HTML pour le nombre de paniers :

Dans le header.php de votre thème, ajoutez le code suivant pour intégrer le nombre de paniers dans une balise HTML avec un identifiant ou une classe unique :

<code class="html"><?php 
$items_count = WC()->cart->get_cart_contents_count(); 
?>
<div id="mini-cart-count"><?php echo $items_count ? $items_count : ' '; ?></div></code>

2. Implémentation du code :

Ensuite, ajoutez ce code à votre fichier function.php ou à n'importe quel fichier de plugin :

<code class="php">add_filter( 'woocommerce_add_to_cart_fragments', 'wc_refresh_mini_cart_count');
function wc_refresh_mini_cart_count($fragments){
    ob_start();
    $items_count = WC()->cart->get_cart_contents_count();
    ?>
    <div id="mini-cart-count"><?php echo $items_count ? $items_count : ' '; ?></div>
    <?php
        $fragments['#mini-cart-count'] = ob_get_clean();
    return $fragments;
}</code>

Ce hook met à jour l'élément "mini-cart-count" avec le nombre mis à jour après avoir ajouté des articles au panier.

3. Déclencheur jQuery facultatif :

Si vous souhaitez forcer la mise à jour du décompte via jQuery, utilisez l'un de ces événements délégués :

<code class="javascript">$(document.body).trigger('wc_fragment_refresh');</code>

<code class="javascript">$(document.body).trigger('wc_fragments_refreshed');</code>

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!