Skip to main content

Styling Overview & Customization (and its Limits)

See what your customers will experience, what you can adjust in Nosto, and where Shopify’s styling takes over.

Katharina Andres avatar
Written by Katharina Andres
Updated today

Overview

The Post-Purchase Upsell page appears right after payment and before the Thank You page. It’s fully embedded in Shopify’s native checkout, meaning it feels familiar and trustworthy to the customer – with zero redirection, popups, or disruptions. This allows a clean, Checkout Native experience - powered by Nosto.

Dynamic Layout, Based on Your Setup

The offer page automatically adjusts its layout to match:

  • The number of products shown in your campaign (1 to 4)

  • The device your customer is using (desktop or mobile)

Elements shown on Post-Purchase Upsell page

  • Order Confirmation header

  • Info-Section, featuring:

    • Title

    • Sub-Title

    • Timer Text & Duration

  • Up to four product cards, each showing:

    • Product Name

    • Price and any applied discount

    • VAT and shipping info (based on Shopify settings)

    • Expandable product description (collapsible by default for 2 or more products shown)

  • A CTA button, which adapts based on available variants:

    1. “Select variant” → triggers inline variant selector

      • After selection: becomes “Pay now”

    2. For single-variant products the CTA will show “Pay now” right away

The layout and text are responsive and built to adjust across screen sizes.

Where the Styling Comes From

You don’t need to configure the design manually. Shopify handles the layout and theme:

  • All styling inherits directly from you Shopify Checkout theme settings

  • Fonts, colors, and spacing follow the brand setup you already use

  • No external CSS or JavaScript is allowed here. Shopify restricts styling in this context for security and performance

If you want to adjust the styling, go to your Shopify Checkout theme editor.

Example how this looks like in Shopify, for our Nosto Demo Store:

Example how this styling then turns out on the corresponsing Post-Purchase Upsell Page (with 3 products offered):

What You Control in Nosto

While the layout is handled by Shopify, you can fully control what content appears:

  • Products displayed: Based on your campaign logic and filters

  • Discount strategy: Choose discount type and value (or no discount)

  • Title and sub-title: Custom copy for each campaign

  • Timer settings: Timer-Text and Duration

Things You Can’t Change

Due to Shopify’s limitations, the following is not customizable:

  • Layout structure

  • Fonts or colors (via Nosto)
    → These can't be indipendent from branding design settings

  • Button wording or behavior
    ​→ May change in the future

  • Adding custom branding (via Nosto)

What's Next

You might want to check:

Did this answer your question?