Cart & Upsell
Cart & Upsell
Cart & Upsell

Cart & Upsell

Customizing Your Cart

Brand the cart drawer's core structure: general colors, header, announcement bar, and footer.

How the editor is laid out

Opening a cart takes you to its editor, split into three top-level tabs — Cart Customize, Display Conditions, and Settings — with a live preview on the right that updates as you edit. Within Cart Customize, a left-hand section list lets you jump between General, Header, Announcement Bar, Tiered Bar, Cart Items, Volume Bundle, Free Gifts, Upsells, and Footer. Click Save in the top-right once you're happy with your changes.

General

The General section sets the base color scheme for the whole cart:

Preset colors
Quick-select swatches for a consistent base color.
Custom Color
Enter any hex value if none of the presets match your brand.
Display Style
Solid Color (flat background) or Image background (upload a custom background image).
Text Color
Default text color used across the cart.
Cart Background Color
Background color of the cart drawer itself.

The Header section controls the top bar of the cart drawer, including its title:

Heading alignment
Left or center-align the header title.
Header Title
Supports the {cart_quantity} variable, e.g. "Cart (cart_quantity)".
Font family / size / weight
Typography controls for the header title.
Text Color
Color of the header title text.
Header Background
Background color behind the header.
Close Button Color
Color of the "X" icon used to close the cart drawer.

Announcement Bar

The Announcement Bar is an optional strip shown at the top of the cart (e.g., a shipping message), toggled on/off independently of the rest of the cart:

Announcement type
Single Announcement (one static message) or Multiple Announcement (rotating messages).
Announcement
The message text, e.g. "Fast, reliable shipping straight to your door."
Title alignment / Font family / Font size / Font weight / Text color
Typography controls for the announcement text.
Background color
Solid color or Gradient — pick a start color for gradients.
Border radius
Rounds the corners of the announcement bar.
Padding
Top, right, bottom, and left spacing, individually adjustable or linked together.

The Footer section builds out everything below the cart items — cart notes, a shipping protection add-on, discount codes, trust badges, and more. See Footer for the full breakdown.

Next, set up a Tiered Bar to encourage customers to spend more.