Skip to content
kymoDocs
Guides

Install on Next.js

Add the tag to your root layout so it loads on every route.

App Router

Put a plain <script> in the <head> of app/layout.js (or .tsx):

export default function RootLayout({ children }) {
  return (
    <html lang="en">
      <head>
        <script defer src="https://kymo.in/beat.js" data-site="yoursite.com"></script>
      </head>
      <body>{children}</body>
    </html>
  );
}

Pages Router

Add the same tag to pages/_document.js inside <Head>:

import { Html, Head, Main, NextScript } from 'next/document';

export default function Document() {
  return (
    <Html>
      <Head>
        <script defer src="https://kymo.in/beat.js" data-site="yoursite.com"></script>
      </Head>
      <body>
        <Main />
        <NextScript />
      </body>
    </Html>
  );
}

Client-side navigation

Kymo tracks history.pushState navigations automatically, so the App Router and next/link client transitions are counted as pageviews without extra work.

Then verify events arrive.

Last updated 2026-07-21