Install
Add the script, give any button a product id.
<script src="https://checkout.komerza.com/embed/embed.iife.js" defer></script>
<button data-kmrza-product-id="…" data-kmrza-variant-id="…">Buy now</button>
Data attributes
bound byKomerza.init()
Basic
Fixed product and variant.
data-kmrza-product-id="…"
data-kmrza-variant-id="…"
Quantity picker
Order details open, quantity editable.
data-kmrza-expand-details
Variant picker
No variant id — the customer picks one first.
data-kmrza-product-id="…"
Bulk discount
Volume pricing; the total follows the quantity.
data-kmrza-expand-details
Dark theme
Instead of following the visitor's system.
data-kmrza-theme="dark"
All options
Quantity, theme, email, coupon, return URL, metadata.
data-kmrza-quantity="2"
data-kmrza-email="…"
data-kmrza-coupon-code="…"
data-kmrza-return-url="…"
data-kmrza-metadata='{…}'
JavaScript
Komerza.open(options)
Basic
The attribute form, from code.
Komerza.open({
items: [{ productId, variantId, quantity: 1 }]
})
Several items
More than one product in the same checkout.
items: [
{ productId, variantId, quantity: 1 },
{ productId, variantId, quantity: 2 }
]
Prefilled email
For a customer you already know.
email: 'prefilled@example.com'
Coupon
Applied on open.
couponCode: 'DEMO20'
Affiliate
Explicit; otherwise the affiliate cookie applies.
affiliateCode: 'partner123'
Return URL
Where the customer goes after paying.
returnUrl: 'https://example.com/order-complete'
Metadata
Stored on the order, sent with webhooks.
metadata: {
campaign: 'summer-sale',
customerId: 'cust_12345'
}
Quantity picker
Order details open on load.
expandDetails: true
All options
Every option in one call.
Komerza.open({
items: [{ …, quantity: 2 }, { …, quantity: 1 }],
theme: 'dark',
affiliateCode: 'partner123',
email: 'vip@example.com',
couponCode: 'VIP25',
returnUrl: 'https://example.com/thank-you?source=embed',
expandDetails: true,
metadata: { campaign: 'vip-promotion', source: 'demo-page' }
})
Options
| Attribute | Option | Notes |
|---|---|---|
| data-kmrza-product-id | items[].productId | Required. |
| data-kmrza-variant-id | items[].variantId | Omit to show the variant picker. |
| data-kmrza-quantity | items[].quantity | Default 1. |
| data-kmrza-theme | theme | light, dark, auto (default). |
| data-kmrza-expand-details | expandDetails | Order details and quantity picker open. |
| data-kmrza-email | Prefilled. | |
| data-kmrza-coupon-code | couponCode | Applied on open. |
| data-kmrza-return-url | returnUrl | After payment. |
| data-kmrza-metadata | metadata | JSON object. |
| — | affiliateCode | Falls back to the affiliate cookie. |