An Instant cart replaces your Shopify theme's default cart with a drawer you design in the builder. You build it as a Cart layout, add cart elements from Insert, connect your add-to-cart buttons to it, and — on the Pro plan or higher — set it as your theme's main cart.
Create a cart layout
In the Layouts & layers panel, use the + menu next to the cart section to add a new cart layout. You can start from:
Empty — the default cart drawer preset.
Template library — a prebuilt cart template.
Instant AI — describe the cart you want and let Instant build it.
Instant can also create a cart the first time you point an add-to-cart action at Instant cart: click Create cart in the Design panel prompt.
The default preset is an overlay drawer: a dimmed backdrop and a panel that slides in from the side. Inside the panel are a Header, an empty-state message, and a filled state that holds the Cart items list and a Footer. The empty and filled states switch automatically based on the number of items in the cart.
Cart elements in Insert
Open Insert → Shopify → Cart to add cart-specific elements. Drag them into the drawer, then arrange them in Layouts & layers:
Header — cart title, an item-count badge, and a close control.
Footer — cart discounts, an estimated total, and a Checkout button.
Product items — the line-item row (image, title, variant, price, a quantity stepper, and a remove control), repeated once per item.
Product upsell — a carousel of recommended products with an add control.
Cart reward — a single progress bar toward one reward threshold.
Multi reward — several reward tiers sharing one progress bar.
Cart add-on — an optional product shoppers can toggle on.
Cart countdown — a countdown timer tied to the cart.
Payment icons — your store's payment method icons.
Repeat cart content
Cart elements use the Repeat element section (Repeat on) to render one row per record. In a cart layout the available sources include:
Cart items — one row per line item (used by Product items).
Cart discounts — one row per applied discount (used in the Footer).
Cart reward tiers — one marker per tier (used by Multi reward).
Related products or Complementary products — Shopify recommendations (used by Product upsell).
Payment methods — on an icon element (used by Payment icons).
Edit the repeated row once to update every instance. See Repeat elements over data.
Connect add-to-cart buttons to Instant cart
For the drawer to open, your add-to-cart controls must target it:
On a product Add to cart action, open the action settings and set Open to Instant cart.
On a header or navigation cart button, use the Open cart action and set Open to Instant cart.
The other Open options are Cart page (the standard Shopify cart page) and Custom cart (your own code). See Add to cart, quantity, and checkout.
Publish as your theme cart
When the drawer is ready, open Cart settings with the gear icon next to the layout name in the top header and, on the General tab, select Set as main cart. Confirm in the dialog to publish. Instant adds the cart as a section in your theme's footer; you can unset it at any time with Remove as main cart on the same tab.
To connect every add-to-cart action across your project and theme automatically, turn on Instant cart actions → Automatic cart actions setup on the same tab. This works with the popular Shopify themes — including Dawn, Sense, Horizon, Prestige, Impact, and Impulse — and most others. Because Shopify themes vary, test your store after enabling it.
If your theme's add-to-cart buttons don't open the Instant cart after this, reach out to Instant support, or build a custom integration with the Instant Storefront SDK.
Plan availability
Designing and previewing a cart layout is available on all plans. Setting it as your theme's main cart — publishing it as the live cart — requires the Pro plan or higher. Until then, shoppers keep using your existing Shopify cart. See Upgrade your plan.