Skip to main content

How it works

Drop-in Checkout renders a ready-to-use payment form in your application. It handles payment method display, form validation, and payment submission while you retain control over when to trigger the payment.

Key Characteristics

AspectDescription
IntegrationOne function call to initialize, one to mount, one to submit
UI ControlPurse controls the payment form appearance and behavior
Payment MethodsDisplays all methods enabled in your Purse dashboard
CompliancePCI-DSS compliant — sensitive data never touches your servers

What You Build vs. What Drop-in Handles

  • Payment method list and selection UI
  • Card input fields with validation
  • Error messages and loading states
  • Redirect flow handling
  • Localization for 13 languages

Requirements

  • Client session: Obtained from the Purse API
  • Payment methods: At least one method activated in your Purse dashboard
  • Browser: Chrome, Firefox, Safari, or Edge (current and previous major versions)

Supported Payment Methods

Drop-in automatically displays payment methods based on your Purse configuration:

  • Cards: Visa, Mastercard, American Express, CB via Stripe, Adyen, Checkout.com, and other processors
  • Digital wallets: Apple Pay, Google Pay, PayPal
  • Buy Now Pay Later: Alma, Floa, Klarna, Oney, Riverty, Scalapay
  • Bank payments: Bancontact, iDEAL, SEPA, MBWay
  • Alternative methods: Gift cards, vouchers, loyalty cards

When to Choose Drop-in

ScenarioRecommendation
Fast integration with minimal code✅ Drop-in
Standard checkout flow✅ Drop-in
Full control over UI componentsConsider Headless Checkout
Custom payment form designConsider Hosted Fields

Next Steps