Change the Woocommerce “Add to Cart” total item notification to “Total Product Entry.”

CSS Code Snippets JS Code Snippets/Functions PHP Code Snippets/Functions

Insert this code into the functions.php

function child_theme_enqueue_styles() {
// 	cart page
	wp_localize_script( 'global-js', 'customMiniCartParams', array(
        'totalUniqueProducts' => custom_get_total_unique_products_in_cart(),
    ) );
}


// Modify your PHP function to return the total unique products as a JavaScript variable
function custom_get_total_unique_products_in_cart() {
    $total_unique_products = 0;

    // Get the cart contents
    $cart = WC()->cart->get_cart();

    // Create an array to store product IDs
    $product_ids = array();

    // Loop through cart items and count unique products
    foreach ( $cart as $item ) {
        $product_id = $item['product_id'];

        // Check if the product has already been counted
        if ( ! isset( $product_ids[ $product_id ] ) ) {
            $total_unique_products++;
            $product_ids[ $product_id ] = true;
        }
    }

    return $total_unique_products;
}

Insert this code to the global.js

function updateMiniCartTotal() {
		const totalUniqueProducts = customMiniCartParams.totalUniqueProducts;
		const $totalResult = $('<span>').addClass('total_result').text(totalUniqueProducts);
		const $itemResult = $('<span>').addClass('item_result').text(`(${totalUniqueProducts} items)`); 
		const $miniCart = $('.wc-block-mini-cart.wp-block-woocommerce-mini-cart');
		const $cartitems = $('.wp-block-woocommerce-mini-cart-contents .wp-block-woocommerce-mini-cart-title-block');

		// Check if the mini-cart exists on the page
		if ($miniCart.length > 0) {
			$miniCart.prepend($totalResult).attr('data-total-unique-products', totalUniqueProducts);
		}
		if ($cartitems.length > 0) {
			$cartitems.append($itemResult);
		}
	}

	// Call the updateMiniCartTotal function on page load
		updateMiniCartTotal();

Insert this code to the global.css

.wc-block-mini-cart.wp-block-woocommerce-mini-cart {
  position: relative;
}

.wc-block-mini-cart__button{
	position:relative;
}
.total_result,
.wc-block-mini-cart__badge,
.wp-block-woocommerce-mini-cart-title-items-counter-block{
	display:none;
}
.wc-block-mini-cart__button{
	z-index:9999;
}
.wc-block-mini-cart.wp-block-woocommerce-mini-cart::before {
  content: attr(data-total-unique-products);
    position: absolute;
    top: 10px;
    right: -7px;
    background-color: #f5f5f5;
    color: #000;
    border-radius: 50%;
    padding: 1px 5px;
    font-size: 10px;
    align-items: center;
    border-radius: 1em;
    box-sizing: border-box;
    display: flex;
    font-weight: 600;
    height: 1.4285714286em;
    justify-content: center;
    left: 100%;
    margin-left: -44%;
    min-width: 1.4285714286em;
    transform: translateY(-50%);
    white-space: nowrap;
    z-index: 1;
}

Leave a Reply

Your email address will not be published. Required fields are marked *