One component. Cards, wallets, bank redirects, BNPL and cash payment methods across 24 markets, ready to render in your existing checkout.

Leveraging PPRO’s extensive expertise in local payments, the Drop-in Checkout UI simplifies the addition and maintenance of local payment methods and cards. The SDK provides you with an already-optimised UI with high converting payment flows to integrate with your checkout.

Key Benefits

🧱 Low development time: Each payment method ships as a registered React or JavaScript-only component with its own validation rules, copy, and logo. Turn one on with a single line in paymentMethodConfig.

🌐 Pay your way, anywhere: Cards, wallets (Amazon Pay, Cash App Pay, Swish…), bank redirects (iDEAL, BLIK, Pay by Bank…), Stablecoins, BNPL, Pix, Boleto, SEPA Direct Debit. All behind one component.

🔒 Secure by design: Card number and CVV live inside PPRO-hosted iFrames. Your servers never touch raw card data, so your integration stays out of PCI scope.

🎨 Customizable to blend with your checkout: Light and dark themes, floating labels, accordion or tab layouts, custom fields and sections. The appearance and forms props go deep.

💬 24 languages, full overrides: Locales for every market we cover, with per-message overrides for brand voice or compliance tweaks via the messages prop.

🔁 One-time and recurring: First-class recurring flows, SEPA mandate copy, tokenised cards, and support for non-native recurring payments offered by PPRO.

Flexible Integration Options

Simplify your entire payment flow or add individual payment methods

The drop-in checkout can be rendered as the entire payment selector or as individual payment method forms.

By rendering the payment selector, you gain the full functionality of the Drop-in Checkout. It’s simpler to add multiple new payment methods and you’ll benefit from features, such as the smart ordering of payment methods.

Alternatively, you can add individual payment methods to your checkout. This would be the quickest way to add one or two key local payment methods. It also gives you the flexibility to A/B test new payment methods to see if they’re a fit for your customers.

Basic or Advanced flow

With two integration options, you have the flexibility to choose a flow that suits your payment needs.

Basic flow: one API request

Your server makes a single Payments Session creation request to the /payment-sessions endpoint. The Drop-In Checkout also automatically handles additional next actions that might be required, such as authenticating with 3D Secure, and also localizes error messages

Advanced flow: two API requests

Your server makes two requests: a Checkout Session creation request to the /payment-sessions endpoint and an authorization request to the payment-sessions/{session-id}/authorizations endpoint.