Next.js

Load the Lienks script once in your root layout.

Before you start

Create your site and copy its site ID first (see Quick start).

Add the snippet

Add next/script to your root layout, app/layout.tsx (App Router):

import Script from 'next/script';

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

With the Pages Router, put the same <Script> in pages/_app.tsx.

Page views in your app

Next.js changes pages through the History API, and Lienks counts these changes automatically. You don’t need to touch the router. Page changes that replace the current URL (replaceState) are not counted.

Track a custom event

Call window.lienks?.event('signup_clicked') wherever something should be counted. More in Custom events.

'use client';

export function SignupButton() {
  return <button onClick={() => window.lienks?.event('signup_clicked')}>Sign up</button>;
}

In TypeScript projects, declare window.lienks as described in Custom events.

Check that it works

Open your site. The first pageview shows up in the dashboard. If nothing arrives, see Troubleshooting.

Good to know

• The site ID isn’t a secret, it is part of the public HTML. An environment variable such as NEXT_PUBLIC_… is optional but not needed.