Designing the post-purchase offer page

The post-purchase offer is a full page shown to a shopper after they complete checkout, just before Shopify's thank-you page. Its customizer works differently from your other widgets: instead of a fixed layout with separate heading and font controls, the Title and Description are rich-text fields with insertable dynamic tags, and the offer has a built-in downsell variant for shoppers who decline the first offer.

This guide walks through every section of the post-purchase customizer so you can write the copy, wire up the buttons, and label the offer exactly how you want it. To set up the offer logic itself (which products show, priority, and timing), see Post-Purchase campaign.

Where the post-purchase offer appears

The post-purchase offer is a single full page that loads after the shopper pays but before they reach the thank-you page. Unlike the slider and list widgets, it has only one layout — there is no Slider/List choice. The customizer is organized into sections you work through top to bottom:

Because there's a single layout, everything you change here applies to the one page shoppers see — there's no per-format styling to keep in sync.

Rich text with dynamic tags

The Title and Description are rich-text editors, not plain text boxes. You can apply formatting (such as font size and center alignment) directly to the words, and — most importantly — you can insert dynamic tags that get replaced with live values when the page renders for a shopper.

Inserting a tag

While editing a Title or Description field, type two open braces ({{) to reveal the tag picker. A mention list appears with the variables you can insert, such as the product name and price. Pick one and it drops in as a styled tag rather than literal text. The field label even reminds you: Hint: Type {{ to reveal tags.

Default copy

If you don't change anything, the offer ships with this copy:

Spacing each field

Each rich-text field has its own Spacer slider that controls the vertical space around it:

Lower the spacer to tighten the layout and pull the headline closer to the description; raise it to give the copy more breathing room.

Downsell variants

Every offer has a fallback: if the shopper declines the main offer, the page can immediately show a downsell — a second, lower-commitment offer — using its own headline and copy. You write the downsell wording in the same Title and Description sections, in the field marked When Offer Declined.

These are also rich-text fields, so the same formatting and {{ dynamic tags work in the downsell variant. For how the decline-then-downsell flow is decided and timed, see Post-Purchase offers in depth.

Buttons section

The Buttons section configures the two actions on the offer: the Purchase button that adds the offer to the order, and the Decline button that skips it.

Purchase button

The purchase button has three text states plus a price toggle:

Turn on Include price when you want the cost of accepting the offer to be obvious on the button itself — for example, so the button reads as a buy action with the amount attached instead of a bare "Buy".

Decline button

The decline button lets the shopper pass on the offer:

Position the decline button at the Top when you want shoppers to be able to dismiss the page quickly, or keep it at the Bottom (the default) so the purchase action is the most prominent choice. Turning on Display as a link de-emphasizes the decline action visually, which keeps attention on accepting the offer.

Labels section

The Labels section holds the small, reusable bits of text the offer page uses to describe pricing and inputs. Set them once and they apply across the offer card.

The Discounted price label is special: include the {{ percentage }} tag anywhere in the text and the app prints the actual discount percentage in its place. So the default (Save {{ percentage }}) renders as something like (Save 20%) for a 20%-off offer. You can reword it freely — for example, to You save {{ percentage }}! — as long as you keep the {{ percentage }} tag intact.

Edge cases and complex scenarios

Keep dynamic tags and placeholders intact

Every dynamic value on the page — a price variable, {{ percentage }}, {timer} — is a placeholder that the app substitutes when the page renders. Treat these tags as atomic.

The offer only renders for eligible orders

A beautifully styled offer is only worth it if shoppers actually see it. The post-purchase page is shown only for eligible orders and payment methods — some payment methods and order shapes can't support a post-purchase upsell, so the page is skipped for those checkouts.

All of this text is translatable

Every piece of copy you write here is translatable, so shoppers in different markets see the offer in their language. The translatable post-purchase fields are the main title (title), main description (description), declined-offer title (downsellTitle), declined-offer description (downsellDescription), purchase button text (buyButtonText), decline button text (skipButtonText), and the timer message.

To add translations, see Translating content.

Recipe: a two-state offer with a price-on-button and a top decline link

This recipe builds a confident upgrade offer that also catches decliners with a downsell, shows the cost on the buy button, and keeps the decline action low-key at the top of the page.

Troubleshooting

Where to go next