The mini-cart in the store header is the one element that keeps the customer informed throughout their whole browsing session of what they already have selected and how much they will pay. While looking for the right product, a customer often visits several pages, and if they lose track of the cart, uncertainty grows, which is one of the main reasons for abandoning a purchase. A well-designed mini-cart acts as a quiet companion: it is always in the same place, never intrusive, yet immediately available when the customer needs it. Below is what it should contain, how it should behave, and how to build it so it builds trust and gently raises the order value.
What the mini-cart should contain
On hover or tap on the icon, the mini-cart should clearly show the selected items with image, name, chosen variant, and quantity. The customer must instantly recognise what is in the cart, without guessing and without opening the full cart page. The product image here is not decoration but the fastest way for the customer to confirm that the cart really holds what they wanted.
Besides the items, the total amount, any discount, and the total number of items should be visible. This information lets the customer track their spending without interrupting browsing. If you use discount codes or quantity deals, the saving should already show here, since a visible saving strengthens the feeling of a good deal.
Finally, two clear links are indispensable: one to the full cart for review and editing, the other straight to checkout. A customer ready to pay should not have to search for the way forward, so the checkout button should be the visually strongest element of the mini-cart.
Example: while browsing a category, the customer hovers over the cart icon and instantly sees they have two items for 48 EUR and a button to continue, without leaving the page they are on.
Progress toward free shipping
If you offer free shipping above a certain amount, the mini-cart should clearly show how far the customer still is from that threshold. This is one of the strongest levers for a higher order value, since it naturally encourages the customer to add one more item rather than pay for shipping. The effect is greatest when the customer is already close to the threshold.
The display should be specific and in real time. A line saying "You are 6 EUR away from free shipping" works better than a generic "Free shipping over 50 EUR", because it tells the customer exactly what to do. A visual progress bar that fills as items are added further strengthens the sense of being close to the goal.
When the customer reaches the threshold, the mini-cart should clearly confirm it, for example with "Congratulations, shipping is free". The confirmation rewards their decision and closes the story you started with the progress display. Without it, the customer is left unsure whether they really reached the benefit.
Example: a customer with items worth 44 EUR sees they are only 6 EUR away from free shipping and adds a small item, pushing the order over the threshold and making it more valuable both for them and for the store.
An empty cart as an opportunity
An empty mini-cart is an often overlooked moment, even though it is an opportunity. A customer who opens it and finds only an empty window saying "Your cart is empty" ends up in a dead end with no idea where to go next. That moment is a shame to waste.
Instead of an empty window, offer an incentive to continue. A link to the best-selling products, to a current promotion, or to popular categories gently returns the customer to the shopping flow. A short, friendly line works better than a dry notice about emptiness.
Example: an empty mini-cart with a "Browse our best-selling products" button gives a visitor who has not selected anything yet a clear next move.
Access on every page
The mini-cart should sit in a consistent place, usually the top-right corner, and be available on every single page of the store. Consistency of position matters, because after a few pages the customer knows where to look without thinking. Any change of position from page to page creates confusion.
Together with sticky navigation, the mini-cart stays within reach even while scrolling through long pages. That way the customer never loses contact with the cart, which reduces the chance they forget about it or lose track of their spending. On mobile devices the icon should be large enough for a reliable tap.
The number of items in the cart should be visible on the icon itself, without opening it. A small badge with a number acts as a constant reminder that the purchase is not yet complete and encourages the customer to finish it.
How to set it up in Magento
The mini-cart is part of the theme and updates on the fly through the cart, so content changes do not require a page refresh. The basic display of items, the total, and the links is available in Magento by default, and you refine it in the header template.
Set the free-shipping threshold as a cart price rule or in the shipping method settings. For the progress display toward the threshold in the mini-cart itself, a dedicated module is required, one that compares the current cart contents with the set threshold and shows the remaining amount and, optionally, a visual progress bar.
How to measure whether it works
Measure the effect of the mini-cart mainly through the average order value and the share of orders that reach the free-shipping threshold. If both metrics rise after introducing the progress display, it is doing its job. Also track the cart abandonment rate, since a clear overview of the contents often reduces drop-off.
It helps to compare the period before and after, and to introduce changes gradually so you know which change produced the result. Small tests, for example different wordings of the progress message, often reveal which form encourages customers the most.
A well-designed mini-cart reduces uncertainty during the purchase, keeps the customer in contact with the cart, and, with progress toward free shipping, gently raises the order value without feeling intrusive.
