Skip to main content
Elixir has four separate upsell surfaces. Each one catches the customer at a different moment, and they work together.
Upsells add the product at its normal price. If the offer is “add this for 50% off”, create the discount in Shopify admin under Discounts, and match its conditions to what the block promises.

​
Product page upsell

Add the Product Upsell block to your product page to offer an add-on right where the customer is deciding.
  1. Open your product page in the theme editor.
  2. Add the Product Upsell block, usually just above or below the Add to Cart button.
  3. Pick the Upsell product.

​
Behavior

The Behaviour setting decides what happens on click: Add with product usually converts better. The customer makes one decision and one click instead of being pulled into the cart mid-consideration.

​
Show it only for certain variants

Show only for variant limits the block to specific variant values. Enter one value, or several separated by slashes:
Use it for add-ons that only make sense with one option, like a case that only fits the large size.

​
Content options

  • Use custom title off shows the product’s own title
  • Make title a link sends customers to the upsell product’s page
  • Show description with your own text
  • Show badge with custom text and optional SVG icon
  • Button text after adding, so the button confirms the add

​
Cart upsells

Cart upsells live in the Cart drawer section. Add them as blocks.

​
Set the header first

Add the Upsell Section Header block once. It controls presentation for the upsells below it:

​
Add individual upsells

Add one Upsell Product block per product you want to offer. Only show when this product is in cart is the setting worth planning around. It turns a generic upsell into a relevant one: offer filters only when the machine is in the cart, offer a leash only with a collar.
Two or three cart upsells is the ceiling. Past that the cart becomes a catalog and customers stop scrolling to the checkout button.
The Upsell Carousel block takes a whole product list in one block instead of one block per product. Use it when you want to offer six accessories without adding six blocks. It shares the same card settings as individual upsells: description source, best seller tag, rating source, card layout, toggle switch, and image style.

​
Bundle upsell

The Product Bundle Upsell block presents a single bundle with urgency built in: The save badge needs a compare-at price on the bundle product. Without one there’s no saving to calculate and the badge stays hidden.

​
A setup that works

  1. Product page: one Product Upsell block set to Add with product, offering the natural companion item.
  2. Cart: an Upsell Section Header with carousel mode on, plus two Upsell Product blocks with trigger products so they’re contextual.
  3. Cart: one Product Bundle Upsell with a countdown for your highest-margin bundle.
Then check the cart drawer on a phone. Upsells are the first thing to make a mobile cart feel bloated.

​
Troubleshooting

Blocks add the product at its normal price. Create an automatic discount in Shopify admin and match its conditions to the offer you advertise in the block.
Check whether Only show when this product is in cart is set. If it points at a product that isn’t in the cart, the upsell stays hidden. Leave it empty to always show.
Set Specific Variant on the block, using either the variant ID from the admin URL or the exact variant title.
The badge is calculated from the compare-at price. Add one to the bundle product in Shopify admin.
Turn on Sticky With Footer in the Upsell Section Header so the checkout button stays pinned, and cut the number of upsells.