If you’re running a WooCommerce store on WordPress and want to display the total number of products in the cart, you’re not alone. Showing the number of items helps improve the user experience, especially when placed in the header, menu, or next to the cart icon.
✅ Why Show the Total Product Count?
- Helps optimize cart display in themes that don’t include it by default.
- Increases user clarity — customers can instantly see how many items they’ve added.
- Encourages more checkout activity by reinforcing product engagement.
🧩 Method: Add Code to Your Theme’s functions.php
To show the total number of items (quantities, not unique products) in the WooCommerce cart, use the following PHP snippet. You can add this to your theme’s functions.php file or via a site-specific plugin.
function wc_cart_product_count() {
// Get total number of products (including quantities)
$count = WC()->cart->get_cart_contents_count();
echo '<span class="cart-count">(' . $count . ')</span>';
}
📌 Usage:
You can call this function in your theme’s header, menu, or anywhere you want to display the cart count:
<?php wc_cart_product_count(); ?>
💡 Note: Make sure WooCommerce is active and the cart is initialized before using this function.
🧠 Want to Style It?
Add custom styles to your theme’s CSS file to make the cart count pop:
.cart-count {
background-color: #ff6f61;
color: #fff;
padding: 4px 8px;
border-radius: 50%;
font-weight: bold;
margin-left: 5px;
}
📌 Optional: Use in a Menu Item or Cart Icon
Many themes support inserting dynamic code into menu areas or widgetized headers. You can place the cart count next to a cart icon like this:
<a href="<?php echo wc_get_cart_url(); ?>">
🛒 Cart <?php wc_cart_product_count(); ?>
</a>
🔁 Keep Cart Count Updated with AJAX
If you’re using AJAX to add products to the cart, you may also want to ensure the cart count updates without page reload. You can hook into WooCommerce fragments like this:
add_filter('woocommerce_add_to_cart_fragments', 'update_cart_count_fragment');
function update_cart_count_fragment($fragments) {
ob_start();
wc_cart_product_count();
$fragments['.cart-count'] = ob_get_clean();
return $fragments;
}
✅ Conclusion
Displaying the total number of products in the WooCommerce cart is a simple enhancement that can make a big difference in your store’s user experience. Whether you’re updating the cart icon in your header or creating a dynamic mini-cart, this small detail improves navigation and usability.
