Upsell Products
What Is It?
Upsell Products shows a row of product recommendations inside the cart drawer. Customers can add any suggestion directly from the drawer with one click, increasing average order value without interrupting their shopping flow.
When to Use It
- You want to surface complementary or frequently bought-together products at the moment of highest intent (when the cart is open)
- You want an automated recommendation system without manual curation
- You want to clear slow-moving inventory by featuring it as a manual upsell
Setup Walkthrough
Step 1: Open Upsell Products Settings
From the Cart Editor, click Upsell products under Body in the left panel.
Step 2: Choose a Product Selection Method
Under Product selection, pick how upsell products are sourced:
| Method | How it works |
|---|---|
| AI recommendation | Auto-suggested based on what is currently in the cart. Set Number of related products shown to control how many appear. |
| Best sellers | Your store's top-selling products. Set Number of best selling products shown. |
| Manual selection | Hand-pick specific products. Click Add more products to browse and select. |
Step 3: Configure Upsell Settings
| Setting | What it does |
|---|---|
| Title | The heading above the upsell section (for example, You may also like) |
| Button action | Add to cart — adds the product directly with one click Quick view — opens a popup with image, variants, and description so shoppers can choose before adding |
| Button label | The button text on each upsell card (for example, Add or View) |
| Modal button label | The add button text inside the Quick View popup (only shown when Button action is Quick view; default: Add to cart) |
| Hide upsell products when added to cart | Removes an item from the upsell list once the customer adds it |
| Display reviews for upsell products | Shows star ratings on upsell cards (requires a review app) |
| Auto slide | Automatically cycles through upsell cards without the customer needing to swipe |
Step 4: Design
Under Design, choose the layout and style the upsell section to match your brand.
Layout — pick how upsell cards are arranged:
| Layout | How it looks |
|---|---|
| Horizontal | Single-row carousel, one card slides into view at a time |
| Vertical | Stacked list with no slider |
| Carousel | Multiple cards visible at once |
Colors & style:
| Setting | What it controls |
|---|---|
| Use border | Toggle to show or hide the border around cards |
| Title color | The upsell section heading |
| Button | The add button's background color |
| Button text color | Text on the add button |
| Border color | The card border color |
| Background color | The background of each product card |
| Button border radius | Corner roundness of the add button (0–50) |
| Card border radius | Corner roundness of product cards (0–50) |
Troubleshooting
Q1: AI recommendation shows no products
AI suggestions need order history to surface patterns. If your store is new or has few orders, switch to Best sellers or Manual selection until enough data accumulates.
Q2: A product I added to the upsell list no longer appears
If Hide upsell products when they are added to the cart is on, products already in the cart are filtered out of the upsell list. This is the expected behavior.
Q3: The upsell section doesn't appear in my drawer
Confirm the Upsell products toggle is enabled in the left panel and that you clicked Save. Also check that at least one product is configured for the selected selection method.