Klarna Docs - Express Checkout

Express Checkout

This guide explains how to add Express Checkout to your Adobe Commerce store.

Express Checkout gives your customers a fast and convenient way to purchase with Klarna. Partners who have integrated Express Checkout see an improved customer experience, increased conversion rates, and a higher AOV.

To learn more about Express Checkout, refer to the product documentation.

A screenshot showing the Express Checkout button in a store's cart.

When you add Express Checkout to the store, a button prompting customers to pay with Klarna is displayed in checkout.

To be able to offer Express Checkout, you have to first enable Klarna in your Adobe Commerce store by installing the Klarna extension.

To install Express checkout in an Adobe Commerce store, follow these steps:

1. In the Klarna Merchant portal, go to Payment settings > Client identifiers to add your store's URL to the allow list and to generate the Klarna client ID.

2. Under Allowed origins for your integrations, click Manage origins and enter your store's URL in the Register new origin section. Then, click Register.

The screenshot of the Klarna Merchant portal showing the Register allowed origin section within the Client Identifiiers menu.

To use Express Checkout in your Adobe Commerce store, you have to whitelist your store's URL.

3. In the Client identifiers for your integrations menu, click on Generate client identifier, then copy it from the Client ID field. Once it’s generated, you can find the client ID and generate new ones in Payment settings > Client Identifiers.

4. In Adobe Commerce, in the Klarna Payments configuration settings, go to the Klarna Express Checkout configuration. Then, paste the Client ID you copied in the Klarna Client Identifier field. Make sure the ID doesn't contain any quotes or whitespace.

A screenshot of the Adobe Commerce Klarna payment extension settings for Klarna Express Checkout.

The Klarna Client Identifier entered in Adobe Commerce has to match the Client ID generated in the Klarna Merchant portal.

5. Select the Enable/Disable checkbox to enable the Express Checkout in the Klarna configuration settings.

6. From the Theme dropdown, select a theme for the button — default, light, or dark.

7. From the Shape dropdown, select a shape for the button — default, rectangle, or pill.

You can customize the Express Checkout button by choosing a theme and a shape. The styling options are available in the Adobe Commerce plugin settings.

The theme defines the button’s color. You can choose 1 out of 3 themes:

  • Default theme with the button displayed in pink
  • Dark theme with the button displayed in black
  • Light theme with the button displayed in white
The default, dark, and light color themes available for the Express Checkout button customization.

The available color themes for the Klarna Express Checkout button are default, dark, and light.

You can choose from 3 different shapes for the button:

  • Default: a rectangular button with rounded corners
  • Rect: a rectangular button with sharp corners
  • Pill: a pill-shaped button with smooth corners
The default, rect, and pill shapes available for the Express Checkout button customization.

The available shapes for the Klarna Express Checkout button are default, rectangular, and pill.