One-click checkout for headless Shopify
Hydrogen, Next.js, or any custom storefront on Shopify. Add a UPI-first, OTP-verified, COD-ready one-page checkout with a few lines of JavaScript — on your own payment gateway, creating real Shopify orders. No theme. No rebuild.
Going headless fixes the storefront and quietly re-opens the hardest part — the India checkout. Send shoppers to Shopify’s generic checkout and you lose the UPI-first, COD-heavy, offer-rich flow they convert on; build your own and you own months of payments, OTP, COD and RTO work; bolt on a theme-based checkout app and it simply doesn’t apply to a headless store. There’s a fourth option.
Prefer the decision-level view first? Read: Headless Shopify checkout in India →
A full India checkout, attached to your storefront.
1. Drop in one script
Load widget.js once in your app root — Hydrogen, Next.js or any React app. No Shopify theme, no Liquid, no app-embed block. It renders its own Shadow-DOM overlay, so nothing clashes with your design system.
2. Hand over the cart
On your “Checkout” or “Buy now” click, your storefront hands the shopper’s cart to IndiSell. That’s the whole integration surface — no theme, no app-embed block, no checkout to build.
3. Shopper checks out on one page
OTP-verified phone → UPI-first payment (intent/QR) or Smart COD → address with pincode intelligence → done. A fully branded one-page flow on your own domain.
What’s in the checkout →4. Real Shopify order, your gateway
The order is created in your Shopify store on the server side from the real product data, so the charged amount is always Shopify’s price — never tampered from the browser. Money settles to your own gateway, with no revenue share on GMV.
A lightweight connect — hours, not a rebuild.
No Shopify theme, no app-embed block, no checkout to build. Your storefront loads a small script once and hands the shopper’s cart to IndiSell when they reach checkout — that’s the entire integration surface. The widget renders its own branded overlay on your domain and runs OTP → payment → address → order, then creates the Shopify order through the Admin connection.
Everything that normally makes a headless checkout a project — payments, OTP, address, Smart COD, RTO, offers, order creation and reconciliation — is handled for you. The setup is small and mostly one-time: connect your Shopify store, add your gateway keys, and wire the checkout button. Our team walks you through the exact integration for your stack, whether that’s Hydrogen, Next.js or a custom React app.
Your storefront. Your gateway. The India checkout you were missing.
Keep your whole stack
Your frontend framework, your hosting (Vercel, Netlify, anywhere), your design system and your Storefront-API data model stay exactly as they are. You went headless for the storefront — you keep it.
Keep your own gateway
PayU, Razorpay, Cashfree, Easebuzz and more. Settlement goes straight to you, with no GMV revenue share — the same economics a themed IndiSell store gets.
Gateways →Gain the full India suite
UPI-first payments, Smart COD with 0–100 risk scoring, RTO control, coupons, bundles, free-gift thresholds and WhatsApp order confirmation — the same feature set as a themed store, nothing stripped out for headless.
Smart COD & RTO →Gain conversion tracking that survives
Server-side conversions to Google and Meta — including COD revenue the browser pixel never sees — fire from the checkout, not from your storefront, so headless doesn’t cost you measurement.
Server-side tracking →Headless Shopify checkout — FAQ.
Can I add a proper India checkout to a headless Shopify store?
Yes. IndiSell runs on top of your existing Shopify store and your own gateway, and attaches to a headless storefront — Hydrogen, Next.js or custom React — through a lightweight JavaScript integration. No Shopify theme is required. You get UPI, COD, RTO control and offers without building the checkout yourself.
How much work is the integration?
Hours, not a rebuild. You load one script globally and call window.IndiSellCheckout.open(cart) on your checkout button, passing your cart in a small JSON shape (numeric variant ids, prices in paise). The heavy parts — payments, OTP, address, COD, RTO, offers, order creation and reconciliation — are all handled for you. Most of the setup (connecting your Shopify store, adding gateway keys) is one-time.
Do I lose my custom storefront or my payment gateway?
No. You keep your frontend, framework and hosting, and the checkout runs on your own gateway (PayU, Razorpay, Cashfree, Easebuzz) with direct settlement and no revenue share on GMV. Orders are created in your Shopify store on the server side at Shopify’s real price.
Does it work with Hydrogen and Next.js specifically?
Yes — and with any custom React storefront. The integration is framework-agnostic: load the script (e.g. with next/script or your Hydrogen root), map your cart, and open the checkout. The overlay is a self-contained Shadow-DOM layer, so it won’t clash with your app’s CSS.
Is the price safe if the cart comes from the browser?
Yes. The charged amount is always recomputed server-side from the Shopify variant id. The prices you pass are only for the on-screen summary — a shopper can’t under- or over-charge themselves from the client.
Should I go headless just to get a better checkout?
Usually no. If your only reason is a faster, more customisable checkout, a one-page checkout like IndiSell on a normal Shopify theme gives you that without maintaining a custom storefront. Go headless for the storefront; add IndiSell for the checkout — on a theme or headless, the checkout is the same.
Ready to fix the leak between add-to-cart and paid?
See it live on your own store — a private preview link runs the real checkout for you before a single shopper sees it.