Klarna Checkout for BigCommerce PWA

Klarna Checkout for BigCommerce PWA



Please make sure you set up the same tax settings in BigCommerce Control Panel and JMango360 Back Office; otherwise, Klarna Checkout will not work correctly.

Klarna Checkout allows you to provide your customers with truly smooth purchase experiences. This article shows how to integrate your BigCommerce PWA with Klarna Checkout to let your customers take payments via Klarna.

PWA version: 1.8.0

Step 1. Generate API credentials in Klarna Merchant Portal

API credentials are required to authenticate with Klarna when placing orders for your PWA. 



Do the following to generate API credentials:
  1. Log in to Klarna Merchant Portal and navigate to Preferences > Settings > Credentials.
  2. Click Generate new API credentials, then save the credentials to your computer for later use.

Step 2. Enable Klarna Checkout in JMango360 Back Office

Apart from standard checkout and web checkout, you can now make use of Klarna Checkout as a checkout method in your PWA. 



Do the following to enable Klarna Checkout:
  1. Log in to JMango360 Back Office and navigate to Settings > Checkout Settings > Select checkout option > Enable Klarna checkout.
  2. Set up Klarna Checkout.
    1. Region: Currently only Europe region is supported.
    2. Environment: The environment specifies where requests via the API should be directed - sandbox/playground or production. Each environment requires a different set of API credentials.
    3. Username (UID): The username linked to your Merchant ID at Klarna. Please find the username in the *.txt file you downloaded in the first step.
    4. Password: A unique password that is associated with the username. Please find the username in the *.txt file you downloaded in the first step.
    5. Display name: The title shown in the top bar of Klarna Checkout screen in your PWA.
    6. Test Settings: After filling in the required information, click this button to check if the API credentials are valid.
    7. Specify allowed countries: Select the billing countries where you allow to use Klarna Checkout. The store country is selected by default and cannot be excluded from the allowed country list.
  3. Click Save Changes.

Step 3. Configure tax settings for Klarna Checkout

Tax configuration is needed for Klarna Checkout. Please set up tax zones, tax rates, and other tax settings in JMango360 Back Office > Settings > Tax Settings. Make sure you set up the same tax zones and tax rates in both JMango360 Back Office and BigCommerce Control Panel.

For details about tax settings, please see BigCommerce PWA tax settings.

Apart from other common tax settings, once you enable Klarna Checkout, a setting for shipping cost tax becomes available so you can specify a tax class to calculate shipping and handling costs (if any). In Tax Settings > Tax Configuration, select a tax class which will be applied to both shipping and handling charges during checkout.




How to track orders paid with Klarna?

Klarna order ID can be found in both BigCommerce Control Panel and Klarna Merchant Portal. In BigCommerce Control Panel > Orders > View Orders just click the plus icon to the left of an order to expand the details of that order. Klarna order ID is placed under the first column which shows the order's billing information. 



You can use this Klarna order ID to search for the order in Klarna Merchant Portant. 



    • Related Articles

    • Video Tutorials - Create Your Integrated PWA

      Create a Magento 2 PWA Create a BigCommerce PWA Create a PrestaShop 1.7 PWA Create a PrestaShop 1.6 PWA
    • Klarna Checkout [BigCommerce React Native]

      Please make sure you set up the same tax settings in BigCommerce Control Panel and JMango360 Back Office; otherwise, Klarna Checkout will not work correctly. Klarna Checkout allows you to provide your customers with truly smooth purchase experiences. ...
    • BigCommerce PWA tax settings

      Settings available in JMango360 Back Office > Settings > Tax Settings. PWA's tax settings control how taxes are calculated and shown on your PWA. JMango360 allows you to display tax in several pages within your PWA, including product list, product ...
    • BigCommerce PWA checkout: standard and web checkout

      Settings available in JMango360 Back Office > Settings > Checkout Settings. A good checkout process is a super important element of the m-commerce experience. With that in mind, JMango360 makes the checkout process as simple and fast for your ...
    • Improved web checkout

      One of the most important pages in the app is checkout. We made it more secure and convenient across various devices. The previous version of the in-app browser, used amongst others to load the eCommerce checkout page, also called the web checkout, ...