What's new?
We've released express checkout, a new checkout variant designed for mobile that prioritizes digital wallets for a frictionless, one-click payment experience.
It's available for Apple Pay, using Apple Wallet to capture customer email address, plus IP address geolocation for address details.
You can integrate using Paddle.js or hosted checkout.
How it works
Express checkout is a checkout variant designed for mobile. It prioritizes Apple Pay, presenting it first to customers, and uses details from Apple Wallet to capture customer email address.
Behind the scenes, Paddle Checkout uses the customer's IP address to estimate the correct tax and pricing before the checkout loads, eliminating the need for customers to enter their address details before opening Apple Pay.
If Apple Pay is unavailable on the customer's device, the checkout automatically falls back to alternative payment methods.
You must verify your domain for Apple Pay to offer the one-click experience in express checkout.
Existing checkout
Checkout opens with the card form and option to pay with Apple Pay
Customer selects Apple Pay, then enters their details
Customer confirms with Apple Pay
Payment complete
Express checkout
Checkout opens with Apple Pay as the first payment method
Customer enters details and confirms with Apple Pay
Payment complete
Examples
This example shows the minimal configuration to open an express checkout:
import { initializePaddle, Paddle } from '@paddle/paddle-js';
const paddleInstance: Paddle | undefined = await initializePaddle({ token: 'live_7d279f61a3499fed520f7cd8c08',});
if (paddleInstance) { paddleInstance.Checkout.open({ items: [ { priceId: 'pri_01gm81eqze2vmmvhpjg13bfeqg', quantity: 1 }, { priceId: 'pri_01gm82kny0ad1tk358gxmsq87m', quantity: 1 }, ], settings: { displayMode: 'inline', variant: 'express', frameTarget: 'checkout-container', frameInitialHeight: 182, }, });}This example opens an express checkout with prefilled customer details, overriding details captured from Apple Wallet and IP address geolocation:
import { initializePaddle, Paddle } from '@paddle/paddle-js';
const paddleInstance: Paddle | undefined = await initializePaddle({ token: 'live_7d279f61a3499fed520f7cd8c08',});
if (paddleInstance) { paddleInstance.Checkout.open({ items: [ { priceId: 'pri_01gm81eqze2vmmvhpjg13bfeqg', quantity: 1 }, { priceId: 'pri_01gm82kny0ad1tk358gxmsq87m', quantity: 1 }, ], customer: { email: 'sam@example.com', address: { countryCode: 'US', postalCode: '10001', }, }, settings: { displayMode: 'inline', variant: 'express', frameTarget: 'checkout-container', frameInitialHeight: 182, }, });}This example passes a price ID along with variant=express to open a hosted checkout as an express checkout for Apple Pay.
https://pay.paddle.io/checkout/hsc_01jt8s46kx4nv91002z7vy4ecj_1as3scas9cascascasasx23dsa3asd2a?price_id=pri_01h1vjg3sqjj1y9tvazkdqe5vt&variant=expressSome parameters aren't compatible with variant: 'express' or are ignored when set. See the Paddle.Checkout.open() reference and hosted checkout reference for the full list of restrictions.
Next steps
Express checkout for Apple Pay is now generally available.
To get started, verify your domain for Apple Pay, then pass variant: 'express' in your Paddle.js settings or variant=express as a query parameter in your hosted checkout URL.
To learn more, see the express checkout concept guide.
Summary of changes
Paddle.Checkout.open()
Paddle.js-
New `express` enum value to enable express checkout for Apple Pay. Must be used with `displayMode: 'inline'`.
-
Boolean to control whether the option to pay another way is shown when `variant` is `express`. Defaults to `true`.
Hosted checkout URL parameters
Paddle.js-
Set to `express` to enable express checkout for Apple Pay on hosted checkout.