WooCommerce: Set up your checkout

Add payment methods

Enhance your customers' payment experience by offering them a variety of payment methods.

What you need to do in advance

Ensure that the payment methods are activated in the Mollie Dashboard.

❗️

Important

Some payment methods require Mollie's approval before they're available in your Mollie Dashboard. If your account has been approved but payment methods are still missing from your dashboard, contact support.

Add payment methods

To add payment methods to your checkout, follow these steps:

1. Log in to WooCommerce.
2. Go to WooCommerce > Settings.
3. Select the Mollie Settings tab.
4. Select Edit next to the payment method name.
5. Select the Enable/Disable checkbox.
6. Save the changes.

📘

Note

To remove unwanted payment methods from your checkout, select the Disable option.

Customize your checkout

Improve the user experience your WooCommerce checkout and maintain its brand consistency by customizing the payment method descriptions, logos, and display.

Change payment method descriptions

Clarify payment method details for customers by adding descriptions to each payment method in your checkout.

1. Log in to WooCommerce.
2. Go to WooCommerce > Settings.
3. Select the Mollie Settings tab.
4. Select Edit next to the payment method name.
5. Enter a description in the Description field.
6. Save the changes.

Change payment method logos

Change payment method logos to match your checkout branding.

1. Go to WooCommerce > Settings.
2. Select the Mollie Settings tab.
3. Select Edit next to the payment method name.
4. Select the Display logo checkbox
5. Select the Enable custom logo checkbox.
   The Upload custom logo field appears.
6. Select Choose file.
   A modal displaying your local file system appears.
7. Go to the folder containing the logo file and select it.
8. In the modal, select the upload button.
9. Save the changes.

📘

Tip

Deselect Display logo if you want to hide payment method logos and display only payment method names.

Style the payment method logo

With the CSS snippets in this article, you can change the position of a payment method's logo relative to its name.

• The snippets only work with WooCommerce shortcodes; they do not work with WooCommerce blocks.
• The snippets provide the expected results with most if not all popular themes.

Default:

Closer to name:

#payment .payment_methods li img {
float:none;
margin-left:1em;
display:inline;
}

//this moves the credit card icon selector images

#payment .payment_methods li svg {
float:none !important;
margin-left:1em;
display:inline;
}

Left of radio button:

#payment .payment_methods li img {
float:left;
margin: 0 .5em 0 0;
}

Between radio button and name:

.mollie-gateway-icon {
width: 32px;
vertical-align: top;
float:left
}

#payment .payment_methods li img {
float:left;
margin: 0 .5em 0 0 ;
}

#payment .payment_methods>.wc_payment_method>label::before {
float:left;
}

Hide the payment method issuer list

Hide the issuer list to redirect payment to a third-party checkout.

This setting applies to the following payment methods:

• iDEAL
• KBC payment button
• Gift cards

1. Log in to WooCommerce.
2. Go to WooCommerce > Settings.
3. Select the Mollie Settings tab.
4. Select Edit next to the payment method name.
5. Deselect Show [payment method] banks drop-down list.
6. Optional: Enter the name of an issuer in the Issuers empty option field.
   This text will replace the default Select your bank text.
7. Save the changes.

Localize your checkout

Localize payment method names, the payment methods displayed in each country, and the order in which they are displayed.

Change payment method names

Localize payment method names in your checkout to cater to the countries you operate in.

1. Log in to WooCommerce.
2. Go to WooCommerce > Settings.
3. Select the Mollie Settings tab.
4. Select Edit next to the payment method name.
5. Enter a localized name for the payment method in the Title field.
6. Save the changes.

Display different payment methods in each country

Display selected payment methods for each country in which you have customers, allowing them to see local payment options when checking out.

📘

Note

By default, Mollie displays all payment methods in all countries.

1. Log in to WooCommerce.

2. Go to WooCommerce > Settings.

3. Select the Mollie Settings tab.

4. Select Edit next to the payment method name.

5. Scroll down to the Sell to specific countries field and specify which payment methods you want to display.
   The Sell to specific countries drop-down list as well as its Select all and Select none buttons give you the following options:

   Option	Explanation
   Leave the field blank	The countries for which Mollie displays the payment method will be the default for your store.
   Select individual countries	Mollie displays the payment method in the selected countries, but not in any other of the store default countries. If you select a country from the drop-down list that is not a store default, it will not display.
   Select all option	Use this option if your store supports all the countries that Mollie supports but you want to exclude some countries. In that case, select Select all and then exclude the unwanted countries by deleting them from the list.
   Select none option	This option returns the setting to its default value, i.e. the countries supported by your store.

6. Save the changes.

Rearrange the payment method display order

Prioritize your customers' preferred payment options by placing them at the top of the list.

1. Log in to WooCommerce.
2. Go to WooCommerce > Settings.
3. Select the Payments tab.
4. Drag the Mollie payment methods in your preferred display order using the handle (bars icon) next to their names.
5. Save the changes.