Skip to main content

Five widget formats

Valotrix Cart Rewards has two kinds of storefront UI: widgets, which the app paints on top of your store pages (toasts, popups, banners), and Custom Blocks, which render inside your theme exactly where you place them (PDP, header, collection grid). This page covers the five widget formats. For inline placements inside your theme layout, see Custom Blocks.

Every campaign can show one or more widgets to communicate progress and reward. Valotrix Cart Rewards ships five formats; you pick which (and how many) per campaign.

1. Toast notification​

A small slide-in card in the corner of the screen, fired when the gift is auto-added or the threshold crosses. Use when: you want low-friction confirmation that something good just happened - no modal interruption.

2. Promo popup​

A modal that opens at a chosen trigger (e.g. on cart-page load if the threshold isn't yet met). Use when: you want the customer to stop and read - for example, a high-value campaign you don't want them to miss.

3. Progress bar​

A persistent bar (usually in the cart drawer or on the cart page) showing distance to the next threshold. Updates in real time as the cart subtotal changes. Use when: the campaign is spend-threshold based and you want shoppers to see exactly how much more they need to add.

4. Gift-choice modal​

The picker modal used by the Customer choice popup recipe. Shows multiple gift options and lets the customer pick. Use when: your campaign offers 2+ gifts and you want the shopper to choose one rather than receive a default.

5. Reminder banner​

A persistent banner (usually a thin strip at the top of the page) that reminds customers about an active campaign. Use when: you want every visitor - not just cart-page visitors - to know the promotion exists.

Customizing each format​

Every widget supports per-template customization (colors, fonts, copy, animation timing) via the Messaging tab in the rule editor (the rule editor's last tab - that's where widget toggles live).

If you need a placement inside your theme layout​

Widgets are great for cart drawers, corner toasts, and full-page popups. But if you want the offer to live inside the page - on a product page, in the header section, or stamped onto collection grid cards - that's a Custom Block. See Custom Blocks for the seven block placements (threshold bar, PDP gift preview, PDP buy-get pairing, urgency banner, inline tier stack, collection eligibility overlay, gift unlock celebration).

For Scale-plan merchants who want to replace a widget's HTML / CSS / JS entirely with their own code, see Custom code (Scale plan).

Next: Custom Blocks →