upsell

The upsell template renders the post-purchase upsell offer page, presenting the customer with additional products after checkout.

Location

The upsell template is located in the templates directory of the theme.

└── theme
    ├── layout
    ├── templates
    │   ...
    │   ├── upsell.json
    │   ...
    ...

Usage

Renders only for an upsell-eligible order. Other requests fall back to the home page. You get two objects: upsell (the offer and its products) and order (the order it applies to). The purchase tracking script is added to the layout for you.

<div id="{{ upsell.id }}" order-id="{{ order.id }}">
  {% if upsell.description %}{{ upsell.description }}{% endif %}

  {% for product in upsell.products %}
    <!-- offered product: product.name, product.variants[0].id -->
  {% endfor %}

  <button>{{ upsell.actions.btn_yes.title }}</button>
  <button>{{ upsell.actions.btn_no.title }}</button>
</div>