🔄 HEADLESS SHOPIFY: "Continue Shopping" Button Redirects to Wrong Domain After Checkout

Shopify App Store
1

:counterclockwise_arrows_button: HEADLESS SHOPIFY: “Continue Shopping” Button Redirects to Wrong Domain After Checkout

Issue Type: Checkout/Post-Purchase Redirect
Store Type: Headless (Custom Frontend + Shopify Checkout)
Urgency: Medium - UX Issue

:memo: Problem Summary

I’m running a headless Shopify store where:

  • Frontend: example-store.com (hosted on Vercel with Next.js)
  • Checkout: example-store.myshopify.com (Shopify’s secure checkout system)

The Issue: After customers complete checkout, the “Continue Shopping” button redirects them to example-store.myshopify.com instead of back to my custom frontend at example-store.com.

:building_construction: Current Setup

Frontend Architecture:

  • Custom Next.js site hosted on Vercel
  • Products displayed on example-store.com
  • Cart functionality built with Shopify Storefront API
  • Checkout redirects to example-store.myshopify.com/cart for secure payment processing

Checkout API Route:

// Intentionally uses .myshopify.com for secure checkout
const shopDomain = process.env.NEXT_PUBLIC_SHOP_DOMAIN;
if (shopDomain && shopDomain.includes('.myshopify.com')) {
  checkoutUrl = checkoutUrl.replace(
    /https?:\/\/[^\/]+/,
    `https://${shopDomain}`
  );
}

Domain Configuration:

  • Primary Domain in Shopify: example-store.myshopify.com (intentional for headless)
  • DNS A Record: Points to Vercel (not Shopify)
  • Checkout System: New Shopify Checkout (Checkout Extensibility)

:magnifying_glass_tilted_left: What I’ve Tried

:cross_mark: “Order Status Page Additional Scripts”

  • Issue: Not available in new checkout system
  • Result: No script injection capabilities on thank you page

:cross_mark: Theme.liquid Script Injection

// Added to theme.liquid <head> section
function fixContinueShopping() {
  const selectors = ['a[href*="continue_shopping"]', '.step__footer__continue-btn'];
  // ... script logic
}
  • Result: Works inconsistently (works on Mac, fails on Windows/mobile)

:cross_mark: Primary Domain Change

  • Shopify support suggested setting example-store.com as primary domain
  • Issue: This would break the entire headless setup by redirecting frontend to Shopify

:cross_mark: Customer Accounts Domain

  • Tried “Change your customer accounts domain” option
  • Result: Only relates to customer login functionality, not post-checkout redirects

:thinking: Specific Questions

  1. For New Checkout System: Is there an official way to control “Continue Shopping” redirect destination without using deprecated scripts?

  2. Checkout UI Extensions: Can extensions modify the thank you page continue shopping behavior? Any examples?

  3. Domain Configuration: Is there a headless-specific domain setup that preserves checkout security while fixing redirects?

  4. Storefront API: Can I programmatically set a return URL when creating checkouts via the API?

:light_bulb: What I Need

  • Solution that works consistently across all devices/browsers
  • Maintains Shopify’s secure checkout infrastructure
  • Doesn’t break my custom frontend hosting
  • Compatible with new checkout system (no legacy script dependencies)

:hammer_and_wrench: Environment Details

  • Shopify Plan: Basic
  • Checkout: New Checkout (Checkout Extensibility)
  • Frontend: Next.js 14 + Vercel
  • API: Shopify Storefront API
  • Domain Provider: Custom DNS

:man_raising_hand: Has Anyone Solved This?

If you’re running a similar headless setup and have solved the “Continue Shopping” redirect issue, I’d love to hear your approach!

Especially interested in:

  • Checkout UI Extension examples
  • Alternative redirect strategies
  • Official Shopify recommendations for headless post-checkout UX

Thanks in advance for any help! :folded_hands:

2

hey there, im avinash a developer wokring on a client project , and facing the same issue, i would like to know what the approach you look to solve this issue. let me know if possible