Wie man BeTheme leeren Minicart (Cache) repariert

Das Problem eines leeren Miniwarenkorbs in BeTheme, insbesondere bei der Verwendung von Cache-Plugins wie FlyingPress, kann das Einkaufserlebnis der Nutzer auf Ihrer E-Commerce-Website erheblich beeinträchtigen. Dieses Tutorial führt Sie durch die Behebung des Problems mit dem leeren Minicart in BeTheme, wenn Sie FlyingPress verwenden.

Das Problem tritt häufig auf, weil Cache-Plugins wie FlyingPress den Inhalt des Miniwarenkorbs zwischenspeichern, was bedeutet, dass die dynamischen Aktualisierungen von WooCommerce (z. B. das Hinzufügen von Produkten zum Warenkorb) möglicherweise nicht sofort übernommen werden. Infolgedessen können Nutzer einen veralteten oder leeren Mini-Warenkorb sehen.

Schritt-für-Schritt-Lösung

Benutzerdefiniertes JavaScript hinzufügen, um die Aktualisierung von Minicart zu erzwingen:

Sie können benutzerdefiniertes JavaScript hinzufügen, um den Inhalt des Minicarts dynamisch zu aktualisieren.

1. Gehe zu BeTheme-Optionen.
2. Navigieren Sie zu Benutzerdefinierte CSS & JS.
3. Fügen Sie den Code ein:

jQuery(function($) {
    var cartElement = $(".mfn-cart-holder");

    // Refreshing basket data based on new fragment
    function refreshCart(fragment) {
        var cartContent = fragment['div.widget_shopping_cart_content'];
        var cartCount = fragment['.header-cart-count'];
        var cartTotal = fragment['.header-cart-total'];

        // Updating cart information
        cartElement.find('.mfn-ch-content').html(cartContent);
        cartElement.find('.header-cart-count').replaceWith(cartCount);
        cartElement.find('.header-cart-total').replaceWith(cartTotal);
        $('.mfn-cart-holder').attr('aria-expanded', 'false');
    }

    // Sending an Ajax request to get a new fragment
    function getUpdatedCart() {
        $.ajax({
            type: 'POST',
            url: wc_add_to_cart_params.ajax_url,
            data: {
                action: 'woocommerce_add_to_cart',
                current_cart: $('.header-cart-count').first().text()
            },
            success: function(response) {
                if (response === 'error') {
                    // Process the error if there was a problem adding the product to the cart
                    return;
                }
                $(document.body).trigger('refresh');
                refreshCart(response);
            }
        });
    }

    // Initiating cart updates on page load
    getUpdatedCart();

    $(document.body).on('refresh', function(e) {
        cart.refresh();
    });

    var cart = {
        refresh: function() {
            $.ajax({
                url: mfnwoovars.ajaxurl,
                data: {
                    'mfn-woo-nonce': mfnwoovars.wpnonce,
                    action: 'mfnrefreshcart'
                },
                type: 'POST',
                cache: false,
                success: function(response) {
                    $('.mfn-cart-holder .mfn-ch-content').html(response.content);
                    $('.mfn-cart-holder .mfn-ch-footer .mfn-ch-footer-totals').html(response.footer);
                    $('.mfn-cart-holder').removeClass('loading');
                    // side cart buttons
                    $('.mfn-ch-footer-buttons').show();
                }
            });
        }
    };
});

Abschluss

Um das Problem des leeren Minicarts in BeTheme zu beheben, wenn Sie Cache-Plugins wie FlyingPress verwenden, müssen Sie sowohl die Cache-Einstellungen anpassen als auch benutzerdefiniertes JavaScript hinzufügen, um dynamische Aktualisierungen zu gewährleisten. Wenn Sie die in diesem Tutorial beschriebenen Schritte befolgen, können Sie Ihren Kunden ein nahtloses Einkaufserlebnis bieten.

Zusätzliche Tipps

• Regelmäßige Tests: Testen Sie Ihre Website regelmäßig, nachdem Sie Änderungen vorgenommen haben, um sicherzustellen, dass alles wie erwartet funktioniert.
• Unterstützung konsultieren: Wenn das Problem weiterhin besteht, wenden Sie sich an den BeTheme-Support oder den FlyingPress-Support, um weitere Hilfe zu erhalten.