Shop Pay on Non-Shopify Stores: BigCommerce, WooCommerce, SFCC

Shop Pay on a non-Shopify storefront is a documented path. Shopify's Shop Pay Wallet API is platform-agnostic. A store built on BigCommerce, WooCommerce, Adobe Commerce (Magento), Salesforce Commerce Cloud, commercetools, SAP Commerce or a custom stack can integrate the Shop Pay button and login. No replatforming is needed. One thing does not go away. You still open a dedicated Shopify store created for Shop Pay Wallet, and that store is the payment back end. Shopify handles the wallet, the payment and a Shopify order record. Your platform keeps the cart, pricing, discounts, shipping, tax and inventory, and has to answer Shop Pay's checkout events in real time. This guide covers the architecture that applies to every platform, then what changes on each one.

What is Shop Pay, and how does it reach non-Shopify stores?

Shop Pay is Shopify's accelerated checkout. A buyer saves their address and card once with Shopify, then pays on any participating store by confirming their email, entering a one-time passcode and tapping Pay now. Shopify states it is used by more than 250 million shoppers in 24 countries. It also cites an April 2023 study claiming conversion up to 50% higher than guest checkout and at least 10% higher than other accelerated checkouts. The shopper count is a Shopify figure and the conversion numbers come from one Shopify-cited study, so treat them as marketing claims rather than a forecast for your store.

Shop Pay started life inside Shopify's own checkout. Shopify's Shop Pay Wallet documentation now describes it as a component you add to an existing checkout. It is a JavaScript SDK on the front end, a set of Storefront API mutations on the back end, and webhooks for what happens after payment. Shopify's enterprise page markets it as Shop Pay on any platform. Our Shop Pay for BigCommerce guide covers that platform in depth. This article is the cross-platform view.

How does Shop Pay work on a non-Shopify storefront?

Shop Pay works on a non-Shopify storefront by splitting the checkout in two, and the split is the same on every platform. Your platform keeps the cart, pricing, discounts, shipping, tax and inventory. A dedicated Shopify store handles the wallet, the payment and a Shopify order record. Beside your storefront you create a dedicated Shopify store for Shop Pay Wallet. The docs are explicit that an existing Shopify store cannot be used. On that store you complete the full Shopify Payments sign-up, install the Shop sales channel and add your storefront origins to its domain allow list. That store holds the payment transaction and a Shopify order record for Shop Pay orders only. Your platform still creates and owns its own order, and the two are reconciled after payment.

Shopify's own responsibility table splits the work cleanly:

Keeping the Shopify fulfilment record updated is what lets buyers track the order in the Shop app. The docs add one rule that catches teams out. Any checkout add-on Shop Pay does not model, such as gift wrap, engraving, loyalty redemption or upsells, must be selected before the buyer enters the Shop Pay flow. The docs also tell you to keep any visible cart total in sync with the delivery, discount and tax changes Shop Pay makes while the Shop Pay window is open.

Is Shop Pay available in the UK for non-Shopify stores?

Shopify's Installments eligibility page assumes UK stores with Shopify Payments have Shop Pay activated, so Shop Pay itself is available to UK Shopify stores. The public Wallet documentation does not list which markets Shop Pay Wallet is open in, so confirm UK eligibility with Shopify during onboarding before planning the build. Shop Pay Installments is a separate product. Shopify's enterprise page lists it for eligible US-based merchants and customers only, while the Shopify Help Center lists eligible stores in the United States, Canada and the United Kingdom. The Wallet docs link an activation guide and tell you to test instalment behaviour if you support it. Confirm availability with Shopify before promising instalments to UK buyers.

Integration steps: SDK, sessions, events and submit

The front end loads the Shop Pay Wallet JavaScript SDK (shop-pay-payment-request.js from Shopify's CDN) and calls window.ShopPay.PaymentRequest.configure with the shopId and clientId from onboarding. It then renders two web components: the Shop Pay button, and the Shop Pay login component near your email field so recognised buyers authenticate early. Your content security policy has to allow cdn.shopifycloud.com, cdn.shopify.com, shop.app, pay.shopify.com, *.shopifysvc.com and *.stripe.com.

The back end builds a payment request (line items, discounts, delivery options, taxes, totals) and creates a session with the Storefront API mutation shopPayPaymentRequestSessionCreate. The mutation returns a session token, a checkout URL and a source identifier, which you pass to the browser. The browser then listens for Shop Pay events:

• shippingaddresschanged
• deliverymethodtypechanged
• deliverymethodchanged
• pickuplocationchanged
• pickuplocationfilterchanged
• discountcodechanged

For each event your platform validates the change, recalculates, and returns a complete updated payment request or a typed error. Two constraints from Shopify's Wallet docs shape the build. Your system should respond to each event within 15 seconds. The completion call must be made exactly once per event.

When the buyer taps Pay now, Shop Pay emits paymentconfirmationrequested, and your handler posts the session token and final payment request to your server. Your server revalidates totals and stock, then creates the order in your platform, reserving inventory first if your stock model needs a hold. It then calls shopPayPaymentRequestSessionSubmit with a required idempotency key, so a retry cannot charge twice. After paymentcomplete you redirect to your own confirmation page.

After payment, four items on the documented production checklist matter most for order operations. Subscribe to the ORDERS_CREATE and ORDER_TRANSACTIONS_CREATE webhooks. Run a reconciliation job that recovers missed events. Push fulfilment tracking back to Shopify so the Shop app can show it. Decide which system and which team owns captures, refunds, cancellations, disputes and order risks. Captures, fulfilment, refunds and cancellations run through the GraphQL Admin API against the dedicated Shopify store.

What changes by platform

Shop Pay on BigCommerce

On BigCommerce, Stencil and Catalyst builds both need a session service that answers the Shop Pay events against BigCommerce's cart, shipping and tax APIs. The delicate part is answering each event synchronously within the event budget while keeping the visible cart total in sync. We cover the BigCommerce-specific decisions and the webhook reconciliation pattern in our Shop Pay for BigCommerce engineering guide. We build these integrations as part of BigCommerce development.

Shop Pay on WooCommerce

WooCommerce has no official Shop Pay plugin; the integration described here is a custom extension built against the Wallet API. The event handlers map naturally onto WooCommerce's own systems: shipping zones and rates answer the delivery method events, coupons answer the discount code event, and the tax engine recalculates on address change. Order creation should use the WooCommerce order CRUD classes, because High-Performance Order Storage keeps orders in custom tables rather than WordPress post records. The 15-second event budget is the risk on shared hosting with a heavy plugin stack: measure rate and tax calculation time before you commit. This is the kind of checkout extension work we scope under WooCommerce development.

Shop Pay on Adobe Commerce (Magento)

On Adobe Commerce the Shop Pay button sits alongside the native checkout as an express option. The build is a module that exposes a session endpoint and recalculates the quote for each event. The quote, shipping and tax pipelines already exist. The engineering is in exposing them synchronously within the event budget, and in reconciling the Adobe order with the Shopify order and transaction records. Merchants weighing an upgrade cycle against a checkout fix should read Magento upgrade cost vs replatforming first. Shop Pay can lift checkout conversion without settling the platform question this year, but it does not remove that question.

Shop Pay on Salesforce Commerce Cloud

Salesforce Commerce Cloud has public reference code from Shopify Partners. The shop-pay-sfcc-connector repository provides an SFRA cartridge and an integration guide. The cartridge includes the Shop Pay modal, a Buy now button on the product page, and order creation on both sides for Shop app compatibility. A separate SiteGenesis connector covers legacy sites. Both are reference code, not managed products. The SFRA guide states that payment capture is left to external systems, and that inventory reservation and price validation must happen in your system before submit. You therefore fork the cartridge and own its maintenance, the capture and refund calls, and the reservation logic. Any Shop Pay build on Salesforce Commerce Cloud should start from that cartridge rather than a blank page.

Shop Pay on commercetools, SAP Commerce and custom headless stacks

Composable and custom stacks tend to be the simplest fit. Cart, shipping and tax are already HTTP services, so the event handlers are thin adapters rather than new synchronous endpoints bolted onto a monolith's checkout pipeline. You add a Shop Pay session service beside your checkout API and map each Shop Pay event to the corresponding cart update. The Shopify order then becomes an external payment record inside your order management flow. The work is mostly in reconciliation and in the order state machine, not the front end. For a broader view of where a headless build pays off, see Catalyst vs Hydrogen.

What Shop Pay Wallet does not do

Shop Pay Wallet does not replace your checkout. It collects address, delivery or pickup, discount code and payment, and nothing else. The Shop Pay window works from the payment request your storefront hands it, so line-item changes and add-ons belong on your storefront before the window opens. Inside Shop Pay the buyer can only change address, delivery, pickup and discount code. Checkout customisation lives in your platform, not in Shopify. Shopify Payments is required on the dedicated store, and Shop Pay Installments follows the eligibility rules described above. The trade-off is that Shopify holds the buyer relationship for the wallet. The saved card, the login and the Shop app order history sit in Shopify's account, not yours, as the responsibility table above shows.

When to add Shop Pay instead of replatforming

Shop Pay Wallet suits a merchant that has a checkout conversion problem, cannot run a full replatform this year, and has engineering capacity to integrate against a documented API. It is a poor fit when the real problem is elsewhere: slow pages, poor product data, or a B2B buyer base paying by invoice rather than card. If the store is already planning a move to Shopify, adding Shop Pay to the old platform is usually wasted work. The new build gets it natively. Our platform comparisons lay out the replatform trade-offs.

Scoping a Shop Pay build

Six things need confirming before an estimate means anything:

1. A dedicated Shopify store created for Shop Pay Wallet with the full Shopify Payments sign-up completed, and confirmation from Shopify that Shop Pay Wallet is open in your market.
2. The storefront origins added to the Shop sales channel allow list, and the six Shopify, Shop and Stripe domains above added to your CSP.
3. Measured evidence that your current rate, tax and discount recalculation can respond within the documented 15-second event budget.
4. An idempotent order and payment submission design.
5. Webhook ingestion with a reconciliation job.
6. An agreed owner for captures, refunds, cancellations and disputes.

With those in place the integration is a bounded checkout project on any of the platforms above. Talk to us if you want the scoping done properly before the first line of cartridge, plugin or module code is written.