Payment Connectors and Applications

Payment Connectors

A payment Connector manages the communication between the seller, commercetools Checkout, and the payment service provider (PSP). Checkout supports both Public Connectors and Organization Connectors of type Payment Service Providers available in the Connect marketplace.

Before creating and configuring your Applications, you must install at least one Connector from commercetools Connect because payment Connectors are required to set payment methods for Applications.

Supported PSPs

Following are the PSPs supported by Checkout for which Public Connectors are available in the Connect marketplace.

Each PSP provides specific payment methods that you can set for your Applications to make them available to your customers.

Sample payment Connector

For test purposes and proofs of concepts, you can use a sample payment Connector that supports credit card and invoice as a payment method. You can install the sample payment Connector from the Connect marketplace.

To simulate payments by credit card using the sample payment Connector, enter the following details in the checkout form.

• Card number:
  • Visa: 4111111111111111
  • Mastercard: 5555555555554444
  • American Express: 341925950237632
• Expiry date: any future date
• CVC/CVV: any three or four digit-number
• Name on card: any text

Applications

An Application lets you set a specific configuration for Checkout, such as country-specific or brand-specific checkout flows. Based on your business needs, you can also create multiple Applications. For example, if you need different settings for different countries, you can create multiple Applications to set up different user agreements, payment methods, etc. for each country.

Create an Application

1. In the Merchant Center navigation menu, select commercetools Checkout > Add application.

   

2. In the Add application page, follow these steps:

   1. In the General information section, do the following:

      • In Application name, enter a plain-text name for the Application.
      • In Application key, enter a unique identifier that contains 2-256 alphanumeric characters and special characters _-^[]+$.
      • Optional: In Application description, enter a plain-text description for the Application.

   2. In the Application settings section, do the following:

      • In Logo URL, enter a valid URL of the logo that will be visible on your checkout page.

      • From Select countries, select the countries where the Application will be available.

      • In Origin URLs, enter the URLs of websites for which you want to use the Application. Only the provided URLs can initialize Checkout.

        URLs must match the following pattern /^(https?:\/\/)?(([a-zA-Z0-9-]+\.)+[a-zA-Z]{2,})\b(?::\d+)?(?!\/)$/i.
        For example, https://www.example.com or https://example.com:8080.

      • In Payment return URL, enter the URL to redirect customers to after they complete the payment transaction.

      • To display the field for entering discount codes on your checkout page, keep the Activation of discount code function toggle in the activated position. Otherwise, deactivate it.

3. Click Save.

4. To add a user agreement, follow these steps:

   1. In the User agreement tab, click Add agreement and do the following:

      • In User agreement name, enter a plain-text name for the user agreement.
      • In User agreement text, enter the text for the user agreement that can include corresponding links (for example, terms and conditions).
      • From User agreement method, select if a mandatory checkbox should be displayed for the user agreement.

   2. Click Save. The order of user agreements in the list will be the same as displayed on your checkout page. To change the order, click Reorder, drag the agreements, and click Save.

      By default, user agreements are deactivated on creation. To activate the user agreement, click the Status toggle.

5. To add a payment method, follow these steps:

   1. In the Payment method via Connect tab, click Add payment method and do the following:

      • From Payment connector, select the payment Connector that you installed from the Connect marketplace and that you want to use for the payment method.
      • From Payment method, select the payment method that you want to activate.
      • In Payment method name, enter a name for the payment method. It will only be displayed in the Merchant Center.

   2. Click Save. The first payment method on the list will be the default payment method on your checkout page. To change the order, click Reorder, drag the payment methods, and click Save.

      By default, payment methods are deactivated on creation. To activate the payment method, click the Status toggle.

6. To activate the Application, click the Status toggle.

Edit and delete an Application

To edit or delete an Application, select commercetools Checkout > Overview in the Merchant Center navigation menu. From the List of applications tab, you can manage Applications:

• To edit an Application, select it and edit the information on the settings page.
• To delete an Application, select it and click the Delete application icon on the settings page.

Possible configurations for Applications

For an Application to work, you must configure at least one payment Connector and one payment method. If you need to manage multiple payment Connectors and/or multiple payment methods, the following configurations are possible:

• Set up different payment methods with different payment Connectors in the same Application. For example, you can set up:
  • Payment Method A with Payment Connector X in Application 1
  • Payment Method B with Payment Connector Y in Application 1
• Set up the same payment method with different payment Connectors in different Applications. For example, you can set up:
  • Payment Method A with Payment Connector X in Application 1
  • Payment Method A with a Payment Connector Y in Application 2