Skip to main content

Embedding options

Resolve pages can be embedded in your shop website with our JavaScript SDK.

Add the following HTML element into your <head></head>:

<script
  id="karla-bundle"
  src="https://browser.gokarla.io/<version>/bundle.min.js"
  shop-slug="my-shop-slug"
  starter-page="resolve"
></script>

For instance, to have always the latest stable version:

<script
  id="karla-bundle"
  src="https://browser.gokarla.io/latest/bundle.min.js"
  shop-slug="my-shop-slug"
  starter-page="resolve"
></script>

After adding the JavaScript SDK, you can now configure the iframe and the bundle will load it if it uses the karla-frame id:

<iframe
  id="karla-frame"
  style="width: 100%;"
  frameborder="0"
  allow="clipboard-read clipboard-write fullscreen"
  sandbox="allow-same-origin allow-scripts allow-forms allow-modals allow-popups"
></iframe>
warning

The iframe element must be placed either within the <head> section or defined in the document before the karla-bundle script is loaded. This ensures proper initialization and communication between the iframe and the Karla SDK.

The resolve page url will be generated from the query parameters defined in the parent page.

  • orderNumber (required): the order number as it is defined in your shop.
  • zipCode (required): the zip code to serve as validation to show the tracking details.
  • flowType (optional): the predefined resolve flow (so issue selection is skipped). Can be defective, notReceived or return.
  • lang (optional): an ISO 639-1 language code. If the language code is supported, the page will be forced to that language even if the user browser has a different locale configured. If not defined, the page will be shown based on user preferences (fallback is en).

Using our API​

See our Claim API Docs to create your own resolve frontend.