Klarna

Klarna is currently in BETA.

Klarna is a payment method that allows consumers to pay for items in instalments, or at a later date.

This does not impact the merchant as they will receive all of the funds upfront as Klarna pays the merchant in full, taking on the debt themselves.

 

To enable Klarna for your account, please contact customer support to set this up.

 

Integrating Klarna using Web SDK

Prerequisites

Make sure you are using Web SDK Version 0.0.18 (or higher).

Make sure you have implemented the following prerequisites:

  • From the Web SDK integration guide, you have completed the following:

    The payment form iFrame must be loaded onto the page in order for payments to work. However displaying the form to the consumer is not required for this transaction type.

    To hide the payment form iFrame, use: <div id="payment-iframe" style="position:absolute;width:0;height:0;border:0;"></div>

To automatically receive non-breaking changes, you can pin to the minor version (0.0) rather than the current patch version (0.0.31).

 

Step One: Display the Klarna Button

Add the Klarna button to your web page:

 

Klarna Button Style:

Parameter

Value

backgroundColor

  • #171717

  • #ffffff

  • #ffb3c7

‚Äč

color

 

  • #ffffff

  • #171717

label

 

  • Pay now

  • Pay later

  • Slice it

width

 

number

height

number

borderRadius

number

 

Step Two: Handle the Klarna Button

Make sure the following parameters are the same values as those entered in Step One: Create a paymentSession, otherwise the transaction will fail:

  • merchantPaymentReference

  • merchantConsumerReference

  • JudoID

  • Currency

  • Amount

This is used to cross reference the validity of the transaction.

 

Your backend server should store the paymentSession response reference returned by Judopay's API. Use this reference from the response to populate yourPaymentSession.

 

  1. Make sure you replace the klarnaConfiguration object values with your own:

 

For the specific input parameters of the products variable, refer to the Klarna Documentation.

 

Step Three: Handle the Response

Once the authorisation is complete you will receive either:

The consumer should be redirected to the outcome screen and the response/error should be handled accordingly.

For example, if the result = SUCCESS redirect the consumer to the Success Page, else ERROR.

 

For more information on the response codes, see Codes.