> ## Documentation Index
> Fetch the complete documentation index at: https://primer.io/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Klarna via Adyen options

> Configuration options for Klarna via Adyen payment integration

Klarna via Adyen enables customers to pay using Klarna's buy now, pay later options, processed through your Adyen connection. Klarna allows multiple payment options depending on the country in which the order is created.

## Quick reference

| Option               | Type     | Default | Description                         |
| -------------------- | -------- | ------- | ----------------------------------- |
| `buttonOptions.text` | `string` | —       | Custom text next to the Klarna logo |

```javascript theme={"dark"}
checkout.options = {
  adyenKlarna: {
    buttonOptions: {
      text: 'Pay with Klarna',
    },
  },
};
```

***

## Button customization

Customize the text displayed on the Klarna via Adyen payment button.

| Option               | Type     | Default | Description                                                                   |
| -------------------- | -------- | ------- | ----------------------------------------------------------------------------- |
| `buttonOptions.text` | `string` | —       | Text displayed next to the Klarna logo. Replaces the default "Pay with" text. |

```javascript theme={"dark"}
adyenKlarna: {
  buttonOptions: {
    text: 'Pay with Klarna',
  },
}
```

<Tip>
  Use button text that reflects the Klarna payment options available in your customer's region (e.g., "Pay later with Klarna" if only offering Pay Later).
</Tip>

***

## How it works

Klarna via Adyen uses a redirect-based payment flow:

1. Customer selects Klarna as their payment method
2. If multiple Klarna payment types are available, the customer selects one (e.g., Pay Now, Pay Later)
3. Customer is redirected to Klarna to authorize the payment
4. After authorization, the customer is redirected back to your checkout

<Tip>
  If Klarna via Adyen only provides a single payment type for the customer's context, no selection list is displayed. The Klarna button will show the available payment type directly.
</Tip>

***

## Client session requirements

Klarna via Adyen requires specific data in the client session to process payments. Pass these when creating the client session on your server.

| Parameter                  | Required | Description                                                 |
| -------------------------- | -------- | ----------------------------------------------------------- |
| `currencyCode`             | Yes      | 3-letter ISO 4217 currency code (e.g., `USD`, `EUR`, `GBP`) |
| `order.lineItems`          | Yes      | Details of the line items of the order                      |
| `order.countryCode`        | Yes      | Country code of the customer                                |
| `customer.emailAddress`    | No       | Pre-fills the Klarna payment form                           |
| `customer.mobileNumber`    | No       | Pre-fills the Klarna payment form                           |
| `customer.shippingAddress` | No       | Pre-fills the Klarna payment form                           |
| `customer.billingAddress`  | No       | Pre-fills the Klarna payment form                           |

<Warning>
  When passing `customer.billingAddress`, ensure that Klarna has payment method categories configured for the given address. If Klarna is not supported for the given billing address, no Klarna button will be rendered.
</Warning>

<Tip>
  Learn more about supported countries and currencies in the [Klarna documentation](https://docs.klarna.com/klarna-payments/in-depth-knowledge/puchase-countries-currencies-locales/).
</Tip>

***

## Redirect configuration

Klarna via Adyen uses Primer's redirect payment flow. By default, the SDK opens a popup overlay for the Klarna redirect. If popups are blocked or the user is in a WebView, it falls back to a full-page redirect.

You can configure redirect behavior through the `redirect` options:

```javascript theme={"dark"}
checkout.options = {
  redirect: {
    returnUrl: 'https://your-site.com/checkout/complete',
    forceRedirect: false,
  },
  adyenKlarna: {
    buttonOptions: {
      text: 'Pay with Klarna',
    },
  },
};
```

See [redirect options](/sdk/primer-checkout-web/sdk-options-reference#redirect-options) for full configuration details.

***

## Testing

### Sandbox testing

Use Primer's TEST environment to test Klarna via Adyen payments without processing real transactions.

Visit the [Klarna Sample Data Page](https://docs.klarna.com/resources/test-environment/sample-customer-data/) for test credentials and sample customer data.

### Production

No special configuration is required to go live — use your production credentials and ensure your Adyen account has Klarna enabled.

***

## Troubleshooting

<Accordion title="Klarna button not appearing">
  **Possible causes:**

  * Klarna via Adyen not configured in Primer Dashboard
  * Adyen connection not set up or Klarna not enabled on your Adyen account
  * Required client session data missing (`currencyCode`, `order.lineItems`, `order.countryCode`)
  * Klarna does not support the customer's billing address or country

  **Debug steps:**

  1. Check browser console for errors
  2. Verify `ADYEN_KLARNA` is in your `enabledPaymentMethods` (if specified)
  3. Verify all required client session parameters are provided
  4. Check that your Adyen account has Klarna enabled for the relevant markets
</Accordion>

<Accordion title="Redirect popup blocked">
  **Possible causes:**

  * Browser popup blocker is active
  * Running inside a WebView that blocks popups

  **Resolution:**
  The SDK automatically falls back to a full-page redirect when popups are blocked. You can also force full-page redirect with `redirect.forceRedirect: true`.
</Accordion>

<Accordion title="Payment types not showing">
  **Possible causes:**

  * Klarna does not offer payment types for the customer's country or order amount
  * Adyen configuration limits available Klarna payment types

  **Debug steps:**

  1. Check Klarna's [supported countries and currencies](https://docs.klarna.com/klarna-payments/in-depth-knowledge/puchase-countries-currencies-locales/)
  2. Verify your Adyen account's Klarna configuration
  3. Verify order amount meets Klarna's minimum requirements
</Accordion>

***

## Complete example

```html theme={"dark"}
<primer-checkout client-token="your-client-token"></primer-checkout>

<script type="module">
  import { loadPrimer } from '@primer-io/primer-js';

  loadPrimer();

  const checkout = document.querySelector('primer-checkout');
  checkout.options = {
    // Redirect configuration (applies to all redirect payment methods)
    redirect: {
      returnUrl: 'https://your-site.com/checkout/complete',
    },

    // Klarna via Adyen configuration
    adyenKlarna: {
      buttonOptions: {
        text: 'Pay with Klarna',
      },
    },
  };
</script>
```

***

## See also

<CardGroup cols={2}>
  <Card title="SDK options reference" icon="gear" href="/sdk/primer-checkout-web/sdk-options-reference">
    All configuration options
  </Card>

  <Card title="Klarna options (direct)" icon="book" href="/sdk/primer-checkout-web/klarna">
    Klarna direct integration options
  </Card>

  <Card title="Klarna documentation" icon="arrow-up-right-from-square" href="https://docs.klarna.com/klarna-payments/">
    Official Klarna documentation
  </Card>
</CardGroup>