The savings widget shows shoppers the regular price of their cart and how much they save, right in the cart drawer. It counts sale prices (a compare-at price above the current price) and discounts applied to products in the cart. The widget appears only when the cart has savings.
Make sure your theme uses a cart drawer. In most themes, this is set in Theme settings → Cart → Cart type: Drawer. If your cart opens as a separate page, use the savings widget on the cart page instead.
1. Configure the widget
To set up the widget, go to Widgets → Savings widget · Cart drawer and click Customize.
Go through the Content and Design settings and adjust them to match your store's design and brand voice. By default, the widget takes the full width of the drawer. Check the result in Preview and click Save.
2. Turn the widget on
Click Activate on the widget card or at the top of the widget page.
3. Check the placement
The Placement section shows how the widget is placed:
Placement via CSS selector. We've set up CSS selectors for many popular themes, including Dawn and other free Shopify themes, so the widget is often placed automatically. First, open the cart drawer and check that the widget appears where you want it.
If you don't see the widget in your cart drawer, or you want it somewhere else, use the other option:
Manual placement via code snippet. To choose the exact spot yourself:
In Shopify admin, go to Online Store → Themes → Edit code.
Open the section or snippet that renders your cart drawer (for example
sections/cart-drawer.liquid).Paste this code where the widget should appear and click Save:
<div class="alpha-sale-savings-drawer"></div>Back in Alpha Sale, click Recheck.
The snippet takes priority over the CSS selector. If you place the snippet, the CSS selector placement shows Not used.
If neither works for your theme, or you'd like help placing the widget, just contact us and we'll set everything up for you.