Card Payment in the Shopping Cart

Instead of redirecting the customer to an external payment gateway, this solution allows you to embed the payment form directly into your e-shop's shopping cart interface. This means the customer does not have to leave the e-shop at the crucial stage of the purchase, stays in a familiar environment, and the percentage of completed orders increases.

The solution is suitable for customers shopping from both mobile phones and computers. It brings the greatest benefit especially on mobile devices, where quick payment via Apple Pay or Google Pay significantly simplifies the completion of the purchase.

This solution is provided via the Comgate Web Checkout SDK.

Information regarding the integration can be found in the API documentation.

If you use an e-commerce solution, verify compatibility with your developer whose module or plugin is used to connect the e-shop with Comgate.

Alongside Web Checkout SDK, it is still possible to integrate the payment gateway into the checkout using an iframe.

Payment methods

You can offer the following payment methods directly in the shopping cart:

• Card payment

• Apple Pay

• Google Pay

3D Secure

The payment solution takes care of the 3D Secure flow automatically and finds the best way to display it, for example, an iframe, a new window, or a redirect.

Payment process

The entire process takes place directly in the cart without leaving the e-shop.

• Method selection in the cart: In the final step of the order, the customer chooses card payment, Apple Pay, or Google Pay.

• Form display: A secure field for entering card details and Apple Pay/Google Pay buttons appear directly on the e-shop page.

• 3D Secure: If the payment requires verification (3D Secure), the system handles it automatically in the most suitable way – most often by opening a secure overlay window (iframe) or a new window on top of the e-shop. The customer confirms the payment in their banking app.

• Order completion: After successful verification, the customer is immediately shown the e-shop page again (e.g. a thank-you page confirming the order).

Custom design

You can customise the payment interface to match the design of your e-shop, for example, by changing colours or font styles.

Appearance configurator

To make implementation and visualization easier, we have prepared a Appearance configurator for you. In it, you can set up the payment interface according to your preferences and then easily generate the integration code to use when implementing this solution. You can also choose from pre-set designs (presets).

What you can customise, for example:

• Choose a look from pre-set designs (presets): These designs can also be further customised.

• Appearance of the Pay button: You can customise the background, border, and text colour, or the width and height of the button itself.

• Form settings: The form for entering card details can have a background, border, or text colour of your choice. You can also choose the font type and size.

• Language settings: Here you can select the language of the interface.

• Google Pay button settings: You can set the colour or text of the button.

• Apple Pay button settings: You can set the height and width of the button and choose its colour or text.

Examples of some possible colour combinations