Next.js

Install Realific in a Next.js App Router or Pages Router project.

App Router

// app/layout.tsx
import Script from 'next/script';

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

Pages Router

Add the same Script to pages/_app.tsx. Route changes are tracked automatically.

Beat ad blockers

Proxy the script through your own domain with Next.js rewrites.