Layout design

Hi,

You can make your own checkout template:
https://docs.krokedil.com/article/143-klarna-checkout-hooks-action-filter#h-H2_3

But maybe you are referring to what is inside the Klarna Iframe?

Best regards
Andreas
[email protected]

I’m actually referring to both. Here are some of my problems which unfortunately I cannot fix myself:

• The Klarna iframe shows all the products and prices of that order, but so does the WC Checkout page. So on the Checkout page this order info is listed twice which is just a bit confusing.
• The “Fill in your address” button is visible even when your address is already filled in on Klarna – again confusing.
• The “Choose another payment method” button is shown on the left whilst the “Fill in my address is on the right” (on split page checkouts), which again just visually is a bit confusing.
• Our terms and conditions are not in the right place anymore, but that can maybe be fixed with hooks.

What would be a real step forward in layout is if the other payment options were not hidden when the Klarna iframe opens. Then the user can quickly and easily select another payment method if they decide to for whatever reason. You could then remove the “Choose another payment method” button and have less clutter. Hiding them is a real user nightmare.

I would be really happy to work on this with you, if you like. I really want to offer Klarna Checkout, but do not risk it right now.

Thank you

Hi @dav74,

Here are some thoughts and answers to your suggestions/questions:

The Klarna iframe shows all the products and prices of that order, but so does the WC Checkout page. So on the Checkout page this order info is listed twice which is just a bit confusing.

Order lines are not displayed by default in the Klarna Checkout iframe. There is only a “View details” link right above the “Proceed to payment” button. If you click that link you will be able to see the contents of the order lines. If you see the product and prices twice on the checkout page I’d say there is something wrong with your WooCommerce configuration.

The “Fill in your address” button is visible even when the customer address is already filled in on Klarna – again confusing.

There is no “Fill in your address” button visible when the customer have entered their address. There is only an “Edit” link visible.

The “Choose another payment method” button is shown on the left whilst the “Fill in my address is on the right” (on split page checkouts), which again just visually is a bit confusing.

“Choose another payment method” is a button added by the plugin (outside of the iframe) to make it possible for customers to switch to a non-Klarna payment method. The looks and placement of this button can absolutely be discussed. However, it is not possible to place it inside the KCO iframe.

Our terms and conditions are not in the right place anymore, but that can maybe be fixed with hooks.

WooCommerce regular terms and conditions checkbox is not displayed at all on the checkout page when Klarna checkout is the selected payment gateway. This can be displayed inside the iframe by activating it in the plugin settings.

What would be a real step forward in layout is if the other payment options were not hidden when the Klarna iframe opens. Then the user can quickly and easily select another payment method if they decide to for whatever reason. You could then remove the “Choose another payment method” button and have less clutter. Hiding them is a real user nightmare.

Klarna Checkout is a payment solution where the basic idea is that all payment methods are displayed inside the iframe. If you would like to offer payment methods from different payment service providers I think that you could have a closer look at Klarna Payments instead. With Klarna Payments, the regular WooCommerce checkout page is used instead.

I would be really happy to work on this with you, if you like. I really want to offer Klarna Checkout, but do not risk it right now.

If you want you are welcome to get in touch directly with me (at [email protected] or [email protected]). I would absolutely be interested in ideas/sketches on how we could improve the layout of the checkout page.

Kind regards,
/Niklas H?gefjord

Hi,
same with me.

The Klarna iframe shows all the products and prices of that order, but so does the WC Checkout page.

then i have to click on “Hide details” to remove it

Kind regards

Hi @niklashogefjord

Many thanks for your detailed reply.
I will start by taking a screen shot of our checkout page and let’s go from there. I will send you an email as soon as I clear some work.

Much appreicated. Thank you

Hi @niklashogefjord

I wrote to you a couple of days ago via email with a layout suggestion. Just wondering if you received my email?

If not check in spam!

Hi @dav74,

Sorry for the late reply. I responded now.

Here is a follow up to this ticket.

The Klarna iframe shows all the products and prices of that order, but so does the WC Checkout page. So on the Checkout page this order info is listed twice which is just a bit confusing.

This seems to be true for German stores. We will add a new setting for this in the plugin so merchants can select if the prices should be displayed in KCO or in WooCommerce checkout.

The “Fill in your address” button is visible even when your address is already filled in on Klarna – again confusing.

This seems to be a bug in the German translation/version of Klarna Checkout. Please get in direct touch with Klarna merchant support to report this (since this is not a plugin issue).

Regarding “Choose another payment method” and other layout suggestions – we will not do any changes in the plugin at the moment. Klarna Checkout’s main purpose is to be an embedded checkout that replaces the standard WooCommerce checkout (offering all payment methods in one solution). If the standard WooCommerce checkout is preferred, then Klarna Payments might be a better solution for you.