Klarna – On-site Messaging

Installation

• To install this plugin you first need to have either Klarna Checkout for WooCommerce or Klarna Payments for WooCommerce installed. You can find the links to this above. 
• You can download the plugin directly via the Klarna Add-Ons menu in WooCommerce or via this download link.

You install this plugin just like any other WordPress plugin:

1. Download and unzip the latest release zip file.
2. If you use the WordPress plugin uploader to install this plugin skip to step 4.
3. Upload the entire plugin directory to your /wp-content/plugins/ directory.
4. Activate the plugin through the ‘Plugins’ menu in WordPress Administration.

Configuration

1. Go to the settings for either the Klarna Checkout or Klarna Payments gateway (WooCommerce > Settings > Payments). At the bottom of these pages you should now see a section called Klarna On-Site Messaging.
2. Data Client ID - Retrieved from your merchant portal. Copy the value entered inside the data-client-id (just the string inside the double quotes) and paste it in the settings field.
   Please note that Data client ID retrieved while the store being in Test mode will not work in Production mode, and vice versa.
3. Enable/Disable the Product placement - Check this box to display On-Site Messaging on product pages.
4. Product page placement data key - Enter the product page placement data-key (retrieved from your merchant portal).
5. Product Placement Theme - Choose between none, light & dark.
6. Product On-Site Messaging placement - Set where on the product pages the Klarna On-Site Message should be displayed.
7. Enable/Disable the Cart placement - Check this box to display On-Site Messaging on the cart page.
8. Cart page placement data key - Enter the cart page placement data-key (retrieved from your merchant portal).
9. Cart Placement Theme - Choose between none, light & dark.
10. Cart On-Site Messaging placement - Set where on the cart page the Klarna On-Site Message should be displayed.

Changing widget location

• klarna_onsite_messaging_product_target for the Product page placement action.
• klarna_onsite_messaging_product_priority for the Product page priority.
• klarna_onsite_messaging_cart_target for the Cart page placement action.
• klarna_onsite_messaging_cart_priority for the Cart page priority.

Code example

// Change the placement action for the widget.
add_filter( 'klarna_onsite_messaging_cart_target', 'change_klarna_onsite_messaging_cart_location' );
function change_klarna_onsite_messaging_cart_location( $location ) {
    // Here you need to replace the $location variable with the action that you want to use instead of the default.
    // You can also add custom checks to apply different locations depending on your needs.
    $location = 'woocommerce_after_cart';
    return $location;
}

// Change the priority for the action for the widget.
add_filter( 'klarna_onsite_messaging_cart_priority', 'change_klarna_onsite_messaging_cart_priority );
function change_klarna_onsite_messaging_cart_priority( $priority ) {
	// Here you need to replace the $priority variable with the action that you want to use instead of the default.
    // You can also add custom checks to apply different priority depending on your needs.
    $priority = '10';
    return $priority;
}

Display On-site messaging via shortcode

From version 1.3.0 you can display On-site messaging via the shortcode  [onsite_messaging].

You can also configure the placement with the following shortcode attributes:

• data-key (optional)
  The type of placement button/image you want to display. Defaults to homepage-promotion-wide. Look into your Klarna merchant account for possible data-key's.
• data-theme (optional)
  The theme/style used to display the button/image. Look into your Klarna merchant account for possible data-theme's.
• data-purchase-amount (optional)
  The specific amount used for the placement. Should be entered in cents/minor units (e.g 100 EUR = 10000).

If you use the data-purchase-amount shortcode on a product or cart page but have no amount specified it will automatically be populated based on the product price or order total.

An example shortcode could look like this:

[onsite_messaging data-key="credit-promotion-small" data-purchase-amount="89900" data-theme="dark"]

Theme support & compatibility

FAQ

I have activated OSM for my store but it is not displayed to all customers

I want to use a Custom Design that I made in the Klarna Merchant Portal but I can't see the changes I make

---

OSM worked in test mode but not when the store is live