# Next.js

Add the tag to a Next.js app, with Script in its root layout.

With the App Router, add the tag with Next.js’s `Script` in the root layout, `app/layout.js` or `app/layout.tsx`:

```
import Script from 'next/script';

export default function RootLayout({ children }) {
  return (
    <html lang="en">
      <body>{children}</body>
      <Script data-domain="example.com" src="https://fiveb.ar/js/tally.js" />
    </html>
  );
}
```

With the Pages Router, put the same `Script` in `pages/_app.js`. `Script` passes `data-domain` through to the tag it adds, and loads the script once however many pages the visitor moves through. Keep its default strategy, `afterInteractive`: `lazyOnload` waits until the browser is idle, and misses visitors who leave before then. See [Next.js’s guide to scripts](https://nextjs.org/docs/app/guides/scripts).

Each page the app moves to is counted as a [single-page app](https://fiveb.ar/docs/single-page-apps.md)’s, with nothing more to add.

Once it’s live, [check it works](https://fiveb.ar/docs/install.md#check-it-works).

---

fivebar is web analytics without cookies, at https://fiveb.ar. Every page of its docs is listed at https://fiveb.ar/docs/index.md.
