Overview
Upcart’s savings row displays information about applied discounts, codes, and savings. If you prefer a more minimal layout, you can selectively hide elements using custom CSS.
You can remove the entire row or just specific pieces like the discount amount, code badges, or the word “Discount.”
Where to find the custom CSS editor
Go to Upcart > Cart Editor > Settings > Custom CSS
Paste the code snippets below into the input area
Click Save
Refresh your storefront to see the changes live
CSS examples
Hide the entire savings row
.upcart-savings-row { display: none !important; }Removes all discount-related content from the cart drawer.
Hide only the discount amount
.upcart-savings-amount { display: none !important; }Keeps the discount label or code visible but hides the amount saved.
Hide discount code badges
.upcart-discount-code-badge { display: none !important; }Hides the visual badge displaying the active discount code.
Hide the word "Discount"
.UpcartDesignSettings__cartTextColor { display: none !important; }Hides static text that uses the word “Discount.” You may want to adjust this selector manually for more precise targeting.
Important note
Hiding elements, especially the discount amount, may reduce visibility of promotions and savings. Consider the customer experience before applying these changes.
Need help?
For advanced styling or layout changes, we recommend working with a Shopify Expert. Upcart’s support team does not assist with custom code implementation.