Install on Vanilla JavaScript
Plain HTML, no framework, no bundler. Script tag in the head of every page for click capture, convert snippet on the thank-you page only.
The simplest install in the framework set: drop a script tag in the <head> of every public page on your site, then fire a convert event on the thank-you page after a purchase. No framework abstractions, no next/script, no bundler — just plain HTML.
If your site uses a shared header partial (Jekyll's _includes/head.html, Hugo's layouts/partials/head.html, Eleventy's _includes/head.html, or any static site generator's templating), you install the script once in the partial and every page picks it up. If your site is a single static HTML file (or a handful of un-templated pages), paste in each page's <head> directly.
Install the head script
In your shared <head> partial (or each page's <head> if no shared partial):
<script>
(function(){
var s=document.createElement('script');
s.src='https://js.rekomi.com/v1/rekomi.js';
s.async=true;
s.dataset.programId='YOUR_PROGRAM_ID';
document.head.appendChild(s);
})();
</script>Your program ID is in Rekomi at Settings > Tracking.
The async attribute means the browser loads Rekomi in parallel with the rest of the page. No measurable Lighthouse impact. The <noscript> fallback inside Rekomi's loader fires a 1x1 pixel for JS-disabled visitors so basic click capture still works.
Fire the conversion on the thank-you page
On your post-purchase / thank-you page only:
<script>
window.Rekomi && window.Rekomi.convert({
external_event_id: 'ORDER_ID',
amount_cents: 9900,
currency: 'USD',
customer_email: 'CUSTOMER_EMAIL',
});
</script>Replace ORDER_ID, 9900, and CUSTOMER_EMAIL with the actual values. Two common patterns for hydrating them:
Backend-rendered (recommended): your server templates the values into the HTML before sending. Use whatever templating engine you have (Jekyll, Hugo, Liquid, ERB, Jinja2, etc.).
URL params: your checkout redirects to the thank-you page with order data in the query string (e.g., https://yourdomain.com/thanks?order_id=xxx&amount=4900&email=user@example.com). Parse with URLSearchParams:
<script>
document.addEventListener('DOMContentLoaded', function(){
var params = new URLSearchParams(window.location.search);
if (!params.get('order_id')) return;
window.Rekomi.convert({
external_event_id: params.get('order_id'),
amount_cents: parseInt(params.get('amount'), 10),
currency: 'USD',
customer_email: params.get('email'),
});
});
</script>Cookie + localStorage attribution
The Rekomi loader stores the click cookie under rekomi_via with a 60-day default expiry. It also writes to localStorage as a backup in case the browser blocks third-party cookies. No manual management needed — the loader handles both surfaces.
If the visitor clears their cookies between click and purchase, localStorage is the fallback. If they clear both, attribution falls back to email-matching at convert time (Rekomi tries to find a recent click matching the customer's email).
Quirks worth knowing
Every page needs the script if you don't have a shared partial. Pasting in one page only means clicks on other pages aren't captured. The most common bug is forgetting a page (the pricing page, or a campaign-specific landing page). Audit your top-of-funnel surfaces.
Async doesn't block. The async attribute means the browser doesn't wait for Rekomi to load before parsing the rest of the page. Critical Rendering Path is unaffected. Lighthouse scores don't move.
<noscript> fallback for JS-disabled visitors. Rekomi's loader includes a <noscript> 1x1 pixel that fires for the small population of visitors with JS disabled. Click capture works (cookie is set server-side via the pixel request); conversion fire from the thank-you page requires JS though.
URL params can leak. If your thank-you page is publicly indexable AND you template order data into URL params, search engines might capture the URL via referrer headers. Set <meta name="robots" content="noindex, nofollow"> on the thank-you page to prevent indexing.
When to consider server-side S2S instead
If your stack has any backend at all (even a serverless function), firing conversions server-side via Rekomi's S2S API is more reliable than browser-pixel firing. Browser pixels can be blocked by uBlock Origin, Brave Shields, Pi-hole, or corporate firewalls. Server-side calls go around all of that.
See S2S tracking API reference for the HMAC pattern. If you're on a backend-heavy stack (Rails, Django, etc.), the framework-specific docs in this section cover S2S install patterns for each.
Troubleshooting
Click cookie not set on the thank-you page. The thank-you page is on a different domain from where the affiliate sent traffic. Browser cookies are scoped to the effective domain that set them; cross-domain cookies don't propagate. Either run both pages on the same domain, or use URL params to pass the affiliate slug forward.
Convert fires but Rekomi shows no conversion. The placeholder values weren't replaced. Open DevTools > Network and look at the request to /api/v1/r/convert. If external_event_id is literally the string "ORDER_ID", your template substitution didn't run.
Amount looks wrong. Make sure you're passing cents (an integer), not decimals. $49.00 = 4900. Multiplying by 100 if your backend sends a decimal is the most common bug.
Related
- JavaScript pixel reference
- S2S tracking API reference — when you have any backend at all
Install on Carrd
Hidden Embed element with Location set to Head, or Pro Plus Site Settings Code field. Carrd's single-page nature means the cookie persists naturally.
Install on Next.js App Router
Use next/script in app/layout.tsx with strategy="afterInteractive". Raw script tags in metadata get stripped. Server Actions can pass the affiliate slug via cookies().