Introduction

Klarna Express Checkout (KEC) is an extension of the Klarna for WooCommerce plugin. It adds a button to the cart and product pages that initiates the Klarna Payments flow. When used on a product page, the selected product is first added to the cart before the flow begins.

When the KEC flow is initiated, Klarna authorizes the customer for the amount currently in the cart. Klarna then returns the customer’s shipping details and redirects them to the checkout page, where they can complete the order using Klarna.

Limitations

Since the authorization takes place before the order is actually placed, there are limitations on what changes the customer is allowed to make while remaining in the KEC flow.

For example, if the customer modifies the address details provided by Klarna, the plugin discards the KEC session and reloads the checkout using the standard Klarna Payments (KP) flow instead.

Similarly, if the cart contents are changed, the KEC session is discarded and the standard KP flow is loaded.

Known compatibility issues

KEC is currently not compatible with the WooCommerce Checkout block. Instead the classic shortcode must be used in order for KEC to work as expected.

Required WordPress/WooCommerce settings

For Klarna Express Checkout to function correct, the setting Hide shipping costs until an address is entered must be disabled.
You can find this setting if you go to WooCommerce → Settings → Shipping → Shipping settings.

Related documentation

• Klarna Docs – Express Checkout
  Read Klarna’s own Klarna Express Checkout documentation.

Klarna Merchant Portal

To configure Klarna Express Checkout you first need to log in to your Klarna Merchant Portal to retrieve the Client identification needed for activation.

1. Log in to your Klarna Merchant Portal.
2. Navigate to Conversion boosters → Express Checkout.
3. Select your store and click Get started and follow the steps.
4. Move on to Activation

You can also access and copy your Client identifier, or generate one, if you navigate to Conversion boosters → Payment settings → Client identifier

Under the Allowed origins tab, you also register the domain(s) you are expecting to use the Web SDK on.

Activation

Go to: WooCommerce → Settings → Payments → Klarna for WooCommerce.

Client ID – For Klarna Express Checkout to work you need to enter the Client ID in the Credentials section for Klarna for WooCommerce. This is retrieved under the Conversion booster tab in your merchant portal.

Copy the Client identifier for your store and paste it in the Client ID field for the country (or region) you wish to activate under the Credentials section.

Please note that Client ID retrieved while the store being in Test mode will not work in Production mode, and vice versa.

Client ID retreived from Conversion boosters → Express Checkout:

Client ID retreived from Conversion boosters → Payment settings:

Configuration

On the Klarna for WooCommerce Settings page, scroll down to the section for Express Checkout to enable and configure placements and style.

1. Enable/Disable – Check the Enable Klarna Express Checkout box to activate.
2. Theme – Set the theme for Express Checkout. Choose between Light, Dark and Custom (configured under Conversion boosters → Express Checkout in your Klarna Portal).
3. Shape – Set the shape of the Express Checkout button. Chose between Rounded, Rectangular and Pill.
4. Placements – Select where you want the Express Checkout button to appear. Choose between All, Product pages and Cart page.
5. Flow – Select the checkout flow for Klarna Express Checkout.

Please note that One step is only available for stores integrating Klarna through a different payment provider, making Two step the default and only flow for merchants using Klarna directly..

6. Webhook – For One step Express Checkout to function, Klarna needs to be able to send callbacks to your store. Click the Create Webhook button to create the necessary webhook in Klarna for the Express Checkout.

Please note that the One step Express Checkout feature is only available when using Klarna through an Acquiring Partner. This means it is currently accessible only in setups where Klarna is provided by a payment service such as Stripe or similar.
At this time, the feature is not available for merchants using Klarna directly.

Express Checkout placement

When Klarna Express Checkout is enabled the Pay with Klarna button will be visible for the customers in your shop.

Product page placement

Cart placement

Troubleshooting

Error “We couldn’t load the next screen” in Klarna Express Checkout modal

This error usually occurs when your site URL has not been added as an Allowed origin in your Klarna Merchant Portal.

Klarna Express Checkout requires your domain to be whitelisted. If it is not, the modal cannot load the next step.

For instructions on how to register your domain(s), see the Klarna Merchant Portal section above.

Make sure that:

• The protocol matches your site (https:// vs http://)
• You include the correct domain (and subdomain, if applicable)
• You are updating the correct environment (test vs production)

After updating Allowed origins, clear your site cache and test again.