Docs/Install Tracking Script

Install Tracking Script

Add one JavaScript snippet to your site. Takes under 60 seconds. Works with React, Next.js, Vue, Svelte, plain HTML — any framework or CMS.

1. Copy the tracking snippet

Replace YOUR_PUBLIC_KEY with the public key shown in your Metrivo dashboard under Websites.

HTML

<script async src="https://metrivo.co/tracker.js" data-site="YOUR_PUBLIC_KEY"></script>

2. Installation by framework

Plain HTML / Any CMS

Paste the snippet just before the closing </head> tag in your HTML. For WordPress, Webflow, or similar CMS — add it via the custom code/header injection settings.

Next.js (App Router)

Use the Next.js Script component from next/script with strategy="afterInteractive". Add it to your root layout.

import Script from "next/script"

<Script
  src="https://metrivo.co/tracker.js"
  data-site="YOUR_PUBLIC_KEY"
  strategy="afterInteractive"
/>

React (Vite / CRA)

Add the snippet to your index.html file inside the public/ folder, just before </head>.

Vue / Nuxt

For Vue SPA: add to index.html. For Nuxt: use useHead composable or add to nuxt.config.ts in the head.script array.

Svelte / SvelteKit

Add to app.html in your SvelteKit project, just before </head>. For Svelte SPA: add to index.html.

3. Verify installation

After adding the script, visit your site and check your Metrivo dashboard. The first pageview should appear within a few seconds. You can also open your browser's devtools network panel — look for a POST to /api/track on metrivo.co returning 200.

If you don't see data after 5 minutes, check:

The script URL is correct: https://metrivo.co/tracker.js
Your public key is correct (Dashboard → Websites → copy public key)
Your Content Security Policy (CSP) allows scripts from metrivo.co
No ad-blocker is blocking the script (common in dev environments with strict extensions)

Next: Connect your payments

Once tracking is live, connect your payment provider to start seeing revenue attribution.