Build your own checkout¶
Mollie provides a hosted checkout system out of the box. Your Mollie integration can be as simple as creating a payment request, sending your customer to our checkout, and letting us handle the rest.
The guide on accepting payments is a good starting point for this basic payment flow.
If you are using an e-commerce platform, chances are we also provide a module for it that offers a deeper checkout experience than this hosted checkout flow.
If, however, you are keen on building your own checkout experience, then read on.
The common checkout path¶
The most common checkout path can be broken down into a handful of steps.

The steps are roughly as follows:
- Your customer wants to check out.
- After setting up a payment using the Create payment endpoint, you send your customer to our payment method selection screen.
- Depending on the payment method, your customer may need to provide additional information.
- Depending on the payment method, the customer may need to authenticate the transaction with their bank or card issuer.
- The customer completes the payment, you receive a webhook, and the customer is sent back to your website.
Embedding method selection¶
A good first step towards a deeper checkout integration is to provide your own payment method selection.

To accomplish this, first use the List payment methods endpoint on the Methods API to retrieve the payment methods currently active on your account.
Once your customer has selected a payment method, use that selection to fill out the method
field in the
Create payment endpoint.
Deeper payment method integrations¶
The next steps for a deeper integration depend on which payment methods you are looking to offer. The below list gives an overview of the typical flow for each of our payment methods, and how they can be integrated further.
Method | Customer-facing flow | Deeper integration |
---|---|---|
Apple Pay |
|
The Apple Pay button (step 1) can be integrated using the Wallets API. |
Bancontact |
|
No deeper integration possible. |
Bank transfer |
|
The bank transfer details (step 2) are returned by the Payments API when setting up the payment. They can be integrated directly, skipping the need for a redirect. |
Credit card |
|
The credit card detail screen (step 2) can be integrated using Mollie Components. See Embedding credit card fields below. |
EPS |
|
No deeper integration possible. |
giropay |
|
No deeper integration possible. |
iDEAL |
|
The issuer selection screen (step 2) can be integrated using the Methods API. See Embedding issuer selection below. The QR flow (step 2) can also be integrated using the QR embed in the Payments API. See the QR codes guide for details. |
in3 |
|
No deeper integration possible. |
KBC/CBC |
|
The issuer selection screen (step 2) can be integrated using the Methods API. See Embedding issuer selection below. |
Klarna: Pay now
Klarna: Pay later
Klarna: Slice it
|
|
No deeper integration possible. |
PayPal |
|
When using the Orders API, you can integrate the PayPal Express Checkout button directly in your checkout for an even faster checkout process. See the Orders guide for details. |
paysafecard |
|
No deeper integration possible. |
Przelewy24 |
|
No deeper integration possible. |
SOFORT |
|
No deeper integration possible. |
Embedding credit card fields¶

For the credit card payment method, you can fully embed the credit card input fields while staying PCI-DSS-compliant using Mollie Components. Refer to the guide on Mollie Components for more information on how to integrate.
Embedding issuer selection¶

For iDEAL, KBC/CBC, and gift cards, we offer a way to embed the issuer selection into the checkout flow. You can
retrieve the available issuers for these payment methods using the issuers
include in the
Methods API.
Once your customer has selected an issuer, use that selection to fill out the issuer
field in the
Create payment endpoint.