Embed on any website

One script, no build step, no framework requirement. This is what powers the Shopify and WooCommerce integrations under the hood too.

The snippet

<div data-circularid-sku="YOUR-PRODUCT-SKU"></div>
<script src="https://circularid.trikagency.com/embed.js?org=YOUR-ORG-ID" async></script>

Place the <div> anywhere on the product page — the script finds every element with adata-circularid-sku (or data-circularid-gtin) attribute on the page and fills it in. One script tag per page is enough even if you have multiple products/badges on it.

How it resolves

On load, the script calls GET /api/public/lookup?org=...&sku=..., which returns the matching product's published passport (name, cover image, and its public URL). If no published passport exists yet for that SKU, nothing renders — no error, no broken badge.

Styling it yourself

The default badge is intentionally minimal. If you want full control over the markup, call the same endpoint directly instead of loading embed.js:

fetch('https://backend.trikagency.com/api/public/lookup?org=YOUR-ORG-ID&sku=YOUR-SKU')
  .then(r => r.json())
  .then(({ data }) => {
    // data.public_url, data.passport_id, data.product.{name,brand,cover_image}
  });

See the API reference for the full response shape and other endpoints.