Klarna Checkout – Optimizing your WooCommerce cart/checkout when using an Iframe-based checkout

Optimizing can be very powerful when it’s properly configured but when using a Iframe-base checkout such as Klarna Checkout, Klarna Payments, Dibs Easy, Collector, Afterpay, Ecster Pay etc. there can be compatibility issues.

Common issues:
  • The JS, CSS files is moved around. 
    This can result in that the checkout doesn’t appear at all.
  • You are minifying/concatenate/caching HTML, CSS and JS-files.
    This can result in double orders, wrong Information in the orders etc.
Common plugins in use when these errors appears:
  • Autoptimize
  • SG Optimizer
  • WP Fastest Cache
  • WP Rocket
  • W3 Total Cache

The summary of this is that if you use a Iframe-based checkout you should NOT do anything with the HTML, JS or CSS on the cart/checkout page.

Files to exclude from optimization

If you are using some kind of optimization feature the following files needs to be excluded from any caching or concatenating:

  • wp-content/plugins/klarna-checkout-for-woocommerce/assets/js/klarna-checkout-for-woocommerce.min.js
  • wp-content/plugins/klarna-checkout-for-woocommerce/assets/js/klarna-checkout-for-woocommerce..js
  • Files from https://js.playground.klarna.com
  • Files from https://js.klarna.com
  • Files from cdn.klarna.com
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.