Documentation
Integrate CertikLabs in 5 minutes.
A single embed turns every verified batch into a public proof of authenticity on your product page, checkout, and packaging.
Step 1
Add the script
Drop this once in your site’s <head>. It’s a 7 KB async module — zero render impact.
<script src="https://cdn.certik.io/badge/v1.js" async></script>
Step 2
Drop the badge
Place the web component anywhere on your product page. Pass the batch ID you want to verify — that’s it.
<certik-badge batch="NW-24-A1207" variant="seal" theme="auto" />
Step 3
Verify it works
Reload the page. The badge should render with the batch’s purity and status. Tapping it opens the public verification page hosted at certik.io/v/<id>.
- No build step required
- Auto-updates when a new batch ships
- Works on SSR, SSG, and SPA frameworks
- Dark and light themes via theme="auto"
Badge variants
Four shapes. One source of truth.
Use the variant that fits the context. All variants pull from the same verified batch record — change a batch result, every variant updates.
variant="seal"
Compact circular seal. Sits next to your Add to Cart.
<certik-badge batch="NW-24-A1207" variant="seal" />
variant="card"
Full trust card with batch ID, purity, and a verify CTA.
<certik-badge batch="NW-24-A1207" variant="card" />
variant="inline"
Single-line strip. Ideal for product titles and hero bars.
<certik-badge batch="NW-24-A1207" variant="inline" />
variant="qr"
QR code linking to the verification page. Print-safe SVG.
<certik-badge batch="NW-24-A1207" variant="qr" />
Platform guides
Wherever you sell, the badge fits.
Shopify
Paste the script tag into theme.liquid, then add the web component to your product.liquid template. Works with Online Store 2.0, Hydrogen, and Liquid themes.
{% comment %} sections/product.liquid {% endcomment %}
<certik-badge
batch="{{ product.metafields.certik.batch_id }}"
variant="card"
/>WooCommerce
Add the script in your theme header. Use a product meta field or shortcode to inject the batch ID per product.
<?php // single-product/title.php $batch = get_post_meta($product->get_id(), 'certik_batch', true); ?> <certik-badge batch="<?php echo esc_attr($batch); ?>" variant="seal" />
Custom (React / Next / Astro)
Treat <certik-badge> as a native HTML element. React 19 supports custom elements directly — no wrapper needed.
// app/products/[id]/page.tsx
export default function Product({ batchId }: { batchId: string }) {
return <certik-badge batch={batchId} variant="card" theme="auto" />;
}Packaging & QR
The trust signal that ships in the box.
Every verified batch gets a permanent QR code. Print it on labels, vial caps, inserts, or packaging — when scanned it opens the live verification page for that exact lot.
- Print-ready SVG and 600 DPI PNG
- Stable URL pattern: certik.io/v/<batch-id>
- Works offline — verification only requires network at scan time
- Optional UTM passthrough for attribution
Download assets
Per-batch QR and badge assets are generated automatically and listed under your dashboard. Or fetch them programmatically:
GET https://api.certik.io/v1/batches/{batch_id}/assets
# Returns: { qr_svg, qr_png, badge_svg, verify_url }