Shoppers often use the cart as a storage and comparison tool. Let’s say Jonah wants to buy a rug. He finds three that he really likes. They’re all checked. One has red and blue squares, the second one has black and blue squares while the third has red and black squares. He adds them to his cart so he could come back to them later and continues browsing other rugs.

If his selections are not differentiated from other rugs in the product lists, Jonah might be confused and add them to his cart for a second time. He may also think his “Add to Cart” operation was unsuccessful. This leads to the issue of double ordering which leads to avoidable returns and customer complaints down the road.

 

How to highlight products in the cart

In products lists (categories)

On a list with many other products, a product that has already been added to cart should be visually distinguishable from other products in the list. You can slightly gray out such a product to indicate its status. Alternatively, you can highlight it with your brand colors instead of graying it out. 

The “Add to Cart” button label can be changed to “View Cart” or “Open Cart” label.

 

On the product page

While some sites might disable the “Add to Cart” button on the product page, this is not advisable because it prevents a customer from buying more than one identical item if they so wish (Jonah might want matching rugs for the bedrooms of his two kids).

The “Add to Cart” button label can be changed to “View Cart” or “Open Cart” label on the product label. You can also have text near the “Add to Cart ” that tells customers the product is already in their cart.

 

Additional functionality

You can suggest relevant upsells and cross-sells whenever customers view a product that is already in their cart. You should also keep a running count of all items a customer has in their cart on the cart icon.

Examples