Skip to content
Kitenzo Headless
Kitenzo Headless is currently invite-only. To enable it on your store, email support@kitenzo.com.

Mode 1 — Embed overview

Embed mode renders the exact bundle experience your customers see on a Liquid theme — the admin-configured template, conditions engine, limit rules, tiered discounts and visual customizations — inside a headless storefront. You write no bundle UI code.

It’s the same <bundle-builder-bundle-v1> custom element used by Liquid themes. The difference: in headless it authenticates with a headless API key and talks to the embed sub-API (with CORS), instead of going through the Shopify app proxy.

Three ways to embed

Section titled “Three ways to embed”

Web component

Drop the <bundle-builder-bundle-v1> element straight into HTML. Works in any framework.

Web component →

React — BundleEmbed

A thin React wrapper that loads the script and mounts the element for you.

React BundleEmbed →

Assets

Section titled “Assets”

The storefront script and CSS are served from the Kitenzo app host:

https://live.bb.eight-cdn.com/bundle-builder-bundle.js   (type="module")
https://live.bb.eight-cdn.com/bundle-builder-bundle.css

The embed sub-API the script calls lives under:

https://live.bb.eight-cdn.com/api/headless/v1/embed

How it works

Section titled “How it works”
  1. The custom element fetches bundle data from the embed sub-API using your api-key as a Bearer token.
  2. It renders the admin-configured template (conditions, limits, tiered discounts and all).
  3. When the customer adds to cart, instead of posting to Shopify’s AJAX cart it fires a kitenzo:addtocart event so you can route the items through the Storefront API. See Cart integration.