Skip to main content
init() does more than connect your page to the store. Once the page has loaded, the script adds the features a merchant turns on in the dashboard, so a custom storefront gets them without any code. None of it touches your markup or your styles. Each piece renders inside its own shadow DOM, so your CSS can’t restyle it and its CSS can’t leak into your page, and it picks up the store’s accent color from its branding. A small “We use cookies” card in the bottom corner (full width on phones) with a Dismiss button. It appears on every page until the visitor dismisses it, and then stays dismissed in that browser. There’s no setting to turn it off. The notice informs; it doesn’t ask. Dismissing it hides it, and that’s all - analytics run either way.

Pop-up offers

The offers a merchant creates under Products → Pop-up Offers: a title, a message, and a coupon code the buyer can copy. Each offer opens either:
  • On entrance - when the page loads, after the delay you set, or
  • On exit intent - when the pointer leaves through the top of the window. That needs a pointer, so in practice it’s desktop only.
An offer can be limited to once per visit or once ever. Nothing appears unless an offer is enabled.

Recent-order notifications

Turn on Recent order notifications under Online Store → Settings → General and small toasts appear in the corner: a buyer’s masked name and country, the product and the price, and how long ago they ordered. The first shows after a few seconds, then another every 15 seconds.
Each notification links to /product?id= followed by the product’s slug - the product page path the visual builder uses. On a custom storefront, serve product pages at that path, or redirect it to yours, before you turn notifications on.

Analytics

The script feeds the store’s analytics in the dashboard. You don’t call anything. Route changes are picked up from the History API (pushState, replaceState and the back button), which is how every mainstream router navigates, so single-page apps need no extra work. Because a successful getProduct() counts as a product view, use it for product pages only. To show names and prices in a cart or a grid, look products up in store.products from getStore() instead. An affiliate link is any page of your storefront with ?ref= and the affiliate’s code on the end. When init() runs it saves the code in a first-party cookie for 30 days, and a later link replaces an earlier one - the last click wins. At checkout the code is exchanged for the affiliate, who is credited with the order. The Embed SDK uses the same cookie, so a buyer who lands on your storefront and pays through an embedded checkout - or the other way round - is still credited to the same affiliate. See Affiliates for how commission works.
Older integrations that set a kmrza_ref cookie to an affiliate’s ID by hand still work. When that cookie is present it takes precedence.

Security

What Komerza takes care of

  • Every order is priced on the server. checkout() sends product IDs, variant IDs, quantities, the email address and the coupon code - never a price. Prices, discounts, stock and quantity limits are all worked out and checked by Komerza, so nothing done to your page’s JavaScript can change what a buyer pays.
  • Payment never touches your site. The buyer pays on Komerza’s hosted checkout, so card details never pass through your page.
  • Checkout has a bot check. Before it creates the order, checkout() runs a check in a small frame served from checkout.komerza.com. Most buyers never see it. Now and then one is asked to confirm they’re human in a small dialog, and checkout carries on once they have. It’s one reason to show a loading state while checkout() runs.
  • Order creation is rate-limited, which blunts scripts that hammer your store with fake orders.

What your page has to do

  • Render store data as text. Review text is written by customers, so an innerHTML that includes it can run their script on your storefront. Use textContent, or your framework’s normal text binding - React, Vue and Svelte all escape by default. Never pass review text to innerHTML, dangerouslySetInnerHTML, v-html or {@html}.
  • Sanitize markdown you turn into HTML. Store and product descriptions are markdown. If you render them as HTML, run the result through a sanitizer such as DOMPurify.
  • Keep API keys out of the page. The client library needs no key, and anything in your page can be read by every visitor. Keys belong on a server, with the API.
  • Allow the SDK in your Content-Security-Policy, if your site sends one - below.

Content-Security-Policy

Only relevant if you host the storefront yourself and send a CSP header. Add these origins to the policy you already have: The redirect to checkout.komerza.com is an ordinary navigation and needs no entry. If a directive is missing, the browser blocks that request and logs a CSP violation in the console - checkout in particular can stall while the bot-check frame is blocked.

What the script stores

Everything is first-party, kept under your site’s own origin:
Last modified on October 15, 2026