Install TracerKit

One script tag in your <head>. After that, tags are managed in the dashboard — no deploys, with verification that every one actually fires.

Fastest: hand it to your AI agent

Paste this into Claude Code, Cursor, or any coding agent. From your dashboard's site page you can copy the same prompt with your real key already filled in.

Install TracerKit (a tag manager with verification) on this site.

1. Add this snippet to the site-wide <head>, before other third-party scripts:

   <script async src="https://tracerkit.com/t.js" data-key="tk_YOUR_SITE_KEY"></script>

   - Next.js App Router: a plain <script> inside <head> in app/layout.tsx
   - Plain HTML / other frameworks: the shared head template
2. Fetch https://tracerkit.com/api/c/tk_YOUR_SITE_KEY to see which tags TracerKit already manages
   for this site. Remove any duplicate hardcoded snippets of THOSE tags from
   the codebase so they don't double-fire. Leave all other scripts alone.
3. Run the site and verify:
   - document.querySelector('script[data-key="tk_YOUR_SITE_KEY"]') exists
   - no console errors from t.js
   - the managed tags appear in the DOM (injected by the loader)
4. Report exactly what you changed and the verification results.

Docs: https://tracerkit.com/docs/install.md

Agents can also read /docs/install.md directly.

Or manually — 1. The snippet

Get your site's key from the dashboard (add a site — the exact snippet is shown on its page).

<script async src="https://tracerkit.com/t.js" data-key="tk_YOUR_SITE_KEY"></script>

~2KB gzipped, async — never blocks rendering. Place it before other third-party scripts.

2. Where it goes

Plain HTML / WordPress / Shopify / Webflow

Paste into the shared head template. WordPress: a header-scripts plugin or your theme's header.php.

Next.js (App Router)

A plain <script> inside <head> in app/layout.tsx — exactly how tracerkit.com runs its own loader. Use next/script with strategy="beforeInteractive" only if a tag must beat hydration. Or render the same snippet as a typed component: <TracerKit siteKey="tk_..."/> from @tracerkit/react (see the SDK docs).

Single-page apps

Nothing extra. The loader tracks history-API route changes for route-triggered tags.

Migrating from Google Tag Manager

Replace the GTM snippet with the TracerKit snippet, then recreate your tags in the dashboard.

3. Move your tags in, then verify

Add each script (GA4, Fathom, Meta Pixel, …) as a tag in the dashboard and delete the old hardcoded snippets so nothing double-fires.

Then load your site: the Health view shows per-tag fire data within a minute, and silence alerts arm automatically on Verification.

Selling online? Implement the TracerKit data layer — a typed e-commerce event schema (view_item → purchase) that feeds purchase triggers and server-side forwarding. Agents: /docs/data-layer.md.

Prefer typed calls over snippets? The JS/React SDK (@tracerkit/js, @tracerkit/react) wraps the loader and data layer with full types. Agents: /docs/sdk.md.

Get your site key Back to home