WooCommerce: Set up credit/debit cards

Mollie for WooCommerce has two credit/debit card checkout features available that provide a smooth payment experience for your customers and increase conversion.

• Mollie Components embeds the credit/debit card fields in your checkout, which saves your customers an extra step in the payment flow.

• One-click payments enables customers to securely save their credit/debit card details for future payments.

  Important: Your sensitive customer data is safe

  No sensitive credit/debit card details are stored in your WooCommerce store. All credit/debit card data is securely stored on Mollie servers.

Tip

Mollie Components and one-click payments are enabled by default.

What you need to do in advance

• Make sure that credit/debit cards have been added to your checkout.

Enable Mollie Components

When customers pay by credit/debit card, they're redirected to the Mollie Checkout where they provide their details to complete their payment.

For your customer's convenience, you can enable Mollie Components to embed the credit/debit card details in your checkout.

1. Log in to WooCommerce.

2. Go to WooCommerce > Settings.

3. Select the Mollie Settings tab.

4. Select Edit next to credit/debit cards.

5. Scroll down to Enable Mollie Components and select it.

6. Select Save changes.

Style Mollie Components

Change how Mollie Components looks in your checkout to suit your branding.

1. Log in to WooCommerce.

2. Go to WooCommerce > Settings.

3. Select the Mollie Settings tab.

4. Click Mollie Components.

   

5. Change the styling settings to suit your preferences.

6. Select Save changes.

Enable one-click payments

By default, Mollie displays all credit/debit card issuers. You can select which ones you want to hide in your checkout.

1. Log in to WooCommerce.

2. Go to WooCommerce > Settings.

3. Select the Mollie Settings tab.

4. Select Advanced.

   

5. Scroll down to Store customer details at Mollie and select it.

6. Select Save changes.

Display selected credit/debit card issuers

By default, Mollie displays all credit/debit card issuers. You can select which ones you want to hide in your checkout.

1. Log in to WooCommerce.

2. Go to WooCommerce > Settings.

3. Select the Mollie Settings tab.

4. Select Edit next to credit/debit cards.

5. Scroll down to Customize icons and select Enable icons selector.

6. Select the credit/debit card icons you want to display in your checkout.

7. Select Save changes.