Skip to content

100 Shopify Checkout Examples: Patterns That Convert in 2026

A pattern library of 100 real-world Shopify checkout examples — trust signals, upsells, custom fields, branding moves, post-purchase, and B2B — pulled from top-converting Shopify and Shopify Plus stores.

C
Cartylabs Team
16 min read
In this article
  1. 01 Pre-checkout: the cart drawer (1–15)#
  2. 02 Checkout — Information page (16–35)#
  3. 03 Checkout — Shipping page (36–55)#
  4. 04 Checkout — Payment page (56–75)#
  5. 05 Branding & layout (76–85)#
  6. 06 Thank You & Order Status (86–95)#
  7. 07 B2B & wholesale (96–100)#
  8. 08 How to actually use this list#

Most “checkout inspiration” posts show you ten screenshots from the same three Shopify Plus brands. This one is different. Below is a pattern library of 100 distinct checkout moves — small, specific, copy-able decisions that we’ve seen working on real Shopify stores in 2026.

They’re grouped by surface: pre-checkout (cart), the checkout pages themselves (information / shipping / payment), the Thank You and Order Status pages, and B2B / wholesale-specific patterns. Each one is one sentence. The point is breadth: scan, find five you don’t do yet, and ship them this quarter.

For the strategic context behind why these patterns work, see the Shopify checkout optimization guide. For the API mechanics, see Checkout Extensibility explained.

Pre-checkout: the cart drawer (1–15)

  1. Free-shipping progress bar — a meter that fills as the customer crosses the free-shipping threshold; the single highest-impact cart drawer element.
  2. Tiered free-gift unlock — “spend $75 for a free X, $125 for a free Y” stacked progress bars.
  3. Dynamic gift selection — let the customer choose their free gift from 3–4 options rather than assigning one.
  4. Frequently bought together at the cart — a 3-card AI upsell that reads the cart contents.
  5. One-tap quantity upsell — “Add a second one for 20% off” inline below the item.
  6. Size / variant swap — change size from inside the drawer without going back to the PDP.
  7. Subscription toggle — “Subscribe and save 15%” upgrade button on subscription-eligible items.
  8. Estimated delivery date — “Order by 2pm for delivery Thursday,” computed from the shipping zone.
  9. Trust strip in the cart — Shop Pay, Apple Pay, Google Pay, secure-checkout iconography above the checkout button.
  10. Stock urgency — “Only 3 left” on low-inventory items in the cart.
  11. Persistent cart across devices — the same cart restored when the user signs in on a new device.
  12. Cart notes field — gift message, dietary restrictions, or “leave at door” instructions.
  13. Bundle pricing display — show the bundle saving as a strikethrough, not just a discount line.
  14. Add-on insurance / shipping protection — opt-in toggle with a price below the subtotal.
  15. Discount code field inside the drawer — applies before checkout so the customer sees the discounted total earlier.

Checkout — Information page (16–35)

  1. Pre-filled email from URL params — pass ?email=... from an abandoned-cart email or PDP signup.
  2. Address autocomplete — Google Places or Shopify’s native autofill on the address field.
  3. Country-detected default — geo-IP the country dropdown so 90% of users don’t have to scroll.
  4. Express checkout buttons above the email field — Shop Pay, Apple Pay, Google Pay, PayPal — visible without scrolling.
  5. “Continue as guest” vs “Log in” — never gate behind account creation; let guests through.
  6. Newsletter opt-in checkbox — unchecked by default in GDPR regions, checked-by-default elsewhere with a small unsubscribe note.
  7. SMS opt-in checkbox — separate from email, with a clear consent line for compliance.
  8. Phone number as optional — “for delivery questions only” microcopy below the field.
  9. Apartment / unit field collapsed by default — expand-on-click to reduce visual length.
  10. Custom checkout field — “How did you hear about us?” — a self-attribution dropdown, useful for attribution beyond pixels.
  11. Custom checkout field — gift recipient name — for the gift-shipping flow.
  12. Custom checkout field — preferred delivery window — slot selection for grocery / local delivery.
  13. Inline shipping cost calculator — show the cost as soon as the ZIP is entered, not after Continue.
  14. Trust badges below the form — “30-day returns,” “Secure checkout,” “Free exchanges” as small inline icons.
  15. Testimonial card on the right rail — a single 1-line review with a star count, swapping based on cart contents.
  16. Cart summary editable inline — quantity changes and item removals without navigating away.
  17. “Order again” for returning customers — pre-fill cart with last order’s contents (for consumables).
  18. Recent purchases social-proof banner — “Sarah from Brooklyn just bought this” rotating notification.
  19. Inline error recovery — invalid postcode triggers a “did you mean…” suggestion rather than a hard error.
  20. Sticky order summary on mobile — collapse / expand drawer at the top of mobile checkout.

Checkout — Shipping page (36–55)

  1. Free-shipping threshold reminder — “Add $12 more for free shipping” upsell on the shipping page itself.
  2. Shipping method comparison — present 2–3 options as cards with price + speed, not a radio list.
  3. Carbon-neutral shipping option — “Pay $1 extra to offset emissions” — high opt-in rates for younger demos.
  4. Local pickup option — for stores with retail locations; offer with a map preview.
  5. Same-day delivery for eligible ZIPs — appears only for ZIPs in range, with a real-time cutoff.
  6. Estimated delivery range — “May 22–24” instead of just “Standard.”
  7. Delivery instructions field — free text for the driver.
  8. Shipping insurance toggle — opt-in with a price, default off in cost-conscious verticals.
  9. Branded carrier logos — UPS / USPS / DHL logos next to each shipping option for legitimacy.
  10. Gift wrap / gift message option — appears as a Function-driven upgrade on the shipping page.
  11. Multi-address shipping — for gifting flows; “ship items to different addresses.”
  12. Pickup-day scheduler — calendar widget for local-pickup orders.
  13. “Why is shipping this much?” — disclosure link with a one-paragraph explanation of carrier costs.
  14. Bundle items into one shipment — toggle for marketplaces / multi-vendor stores.
  15. Eco-packaging toggle — “Use plastic-free packaging” opt-in.
  16. Shipping speed nudge — “Most customers choose Express for orders this size” social proof.
  17. Saturday / weekend delivery — surfaced as a premium option for time-sensitive verticals.
  18. International duties prepaid option — DDP vs DDU choice for cross-border.
  19. Saved addresses for returning customers — selectable cards rather than re-entering.
  20. Shipping protection comparison — Route, Corso, or native Shop Promise as a labeled option.

Checkout — Payment page (56–75)

  1. Shop Pay one-tap — the single biggest mobile conversion lever in Shopify checkout.
  2. Buy-now-pay-later (Affirm, Klarna, Afterpay, Shop Pay Installments) — surfaced as a payment option, not just a banner.
  3. BNPL price split preview — “or 4 payments of $24” shown above the payment selector.
  4. Crypto payment — Coinbase Commerce / BitPay for crypto-leaning verticals (collectibles, electronics).
  5. B2B net terms — invoice / NET-30 option for verified wholesale customers.
  6. Saved cards — Shop Pay vault for returning customers, no re-entry.
  7. Apple Pay / Google Pay — visible before card form for mobile-heavy traffic.
  8. CVV-only re-auth — for repeat customers, skip card re-entry and just confirm CVV.
  9. Gift card application — separate field from discount codes so customers don’t conflate them.
  10. Multiple gift cards stackable — allow more than one gift card per order.
  11. Loyalty points redemption — slider for “use 500 points = $5 off” mid-checkout.
  12. Store credit application — auto-apply with a checkbox to decline.
  13. Tip-the-store option — for restaurants, creators, indie brands — surprisingly high opt-in.
  14. Round up for charity — opt-in micro-donation with cause selection.
  15. Discount code resilience — clear messaging when a code is invalid (“expired” vs “minimum not met”).
  16. Stackable discounts via Functions — code + automatic discount combining where appropriate.
  17. First-order discount popup — applied automatically if the email is new, no code needed.
  18. Last-chance upsell on payment — single-item add-on offered just above the Pay button.
  19. PCI-compliant subscription start — clear messaging for first-of-subscription orders.
  20. Order summary always visible on desktop — sticky right rail with line items, never collapsed.

Branding & layout (76–85)

  1. Custom brand fonts — via the Branding API; a step-change in perceived legitimacy.
  2. Brand color buttons — match the storefront, not Shopify defaults.
  3. Logo in checkout header — link back to the storefront on click (or not, to reduce abandonment).
  4. Brand-consistent header / footer — minimal versions of the storefront chrome.
  5. Custom favicon at checkout — small detail, signals polish.
  6. Photographic header background — for premium / lifestyle brands.
  7. Branded loading states — skeleton screens with brand colors during async loads.
  8. Custom field labels in brand voice — “Where should we send it?” instead of “Shipping address.”
  9. Localized currency display — auto-converted by region, with the converted-from price in small text.
  10. Localized language selector — toggle visible in the checkout header for multi-market stores.

Thank You & Order Status (86–95)

  1. Post-purchase one-click upsell — single-product offer added to the original order pre-shipment.
  2. Post-purchase bundle upsell — 2–3 related items as a “complete the look” card.
  3. Subscription upgrade post-purchase — “Make this a subscription and save 20% on future orders.”
  4. Custom Thank You page content — onboarding video, getting-started guide, brand story.
  5. Referral program CTA — “Give $20, get $20” with a unique referral link generated client-side.
  6. Account creation post-purchase — “Save your order, set a password” — much higher conversion than pre-purchase forced signup.
  7. Survey on Thank You page — 1-question NPS or attribution survey, embedded as an extension.
  8. Order tracking link — Shop app or carrier tracking surfaced immediately.
  9. Estimated delivery widget on Order Status — live updates from the carrier.
  10. Cross-sell email opt-in — “Get tips on caring for [product]” — segments customers by purchase.

B2B & wholesale (96–100)

  1. Quantity-tier pricing displayed inline — “Buy 10+ for $X each” in the cart and checkout.
  2. PO number field — custom checkout field for B2B order references.
  3. Tax-exempt customer flow — auto-apply tax-exempt status for verified wholesale accounts.
  4. NET-30 / NET-60 payment terms — surfaced only for approved B2B customers via customer-segment-gated payment methods.
  5. Quote-to-order conversion — convert an approved quote into a pre-filled checkout session for the buyer to complete.

How to actually use this list

Don’t try to ship all 100. Pick the 5–10 that map to your highest-friction step right now. The diagnostic flow is in the checkout optimization guide — instrument your funnel first, find the leaks, and pick patterns that address the leaks specifically.

For the technical “can I actually build this?” question on any item above, the answer is almost always yes — the Checkout Extensibility explainer maps each kind of customization to the right API surface (UI Extensions, Functions, or Branding API).

If you operate a cart drawer at the pre-checkout step, Cartylabs handles patterns 1–15 out of the box.

Keep reading

All articles →

Start lifting your AOV today.

Install Cartylabs free on Shopify. Setup takes 2 minutes with no developer required.