Install on Next.js

Add XPmetric to Next.js App Router or Pages Router using next/script or a layout head tag.

Add XPmetric to Next.js so every route sends pageviews to your dashboard.

Replace YOUR_SITE_TOKEN with your site token from Settings → Sites → Get Script.

Tracking snippet

<script defer data-site="YOUR_SITE_TOKEN" src="https://xpmetric.com/p.js"></script>

App Router (recommended)

Add to app/layout.tsx using next/script:

import Script from "next/script";

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="en">
      <head>
        <Script
          src="https://xpmetric.com/p.js"
          data-site="YOUR_SITE_TOKEN"
          strategy="afterInteractive"
        />
      </head>
      <body>{children}</body>
    </html>
  );
}

Replace YOUR_SITE_TOKEN with your token from Settings → Sites → Get Script.

Pages Router

Add the same <Script> tag inside <Head> in pages/_document.tsx:

import Document, { Html, Head, Main, NextScript } from "next/document";
import Script from "next/script";

export default class MyDocument extends Document {
  render() {
    return (
      <Html>
        <Head>
          <Script
            src="https://xpmetric.com/p.js"
            data-site="YOUR_SITE_TOKEN"
            strategy="afterInteractive"
          />
        </Head>
        <body>
          <Main />
          <NextScript />
        </body>
      </Html>
    );
  }
}

Verify

Deploy or run locally and visit any page.
Open your site dashboard — you should see a pageview in the live feed within ~60 seconds.

Troubleshooting

If pageviews never appear, your Content-Security-Policy may block p.js. See CSP troubleshooting.