Name: Affonso
Rating: 4.8 (127 reviews)

Next.js provides built-in Script optimization that makes it easy to add tracking scripts with optimal loading performance.

Add tracking script to your root layout

Next.js App Router allows you to add scripts globally through the root layout component for consistent tracking across all pages.

Open your root layout file at app/layout.tsx (or app/layout.jsx)
Import the Script component from next/script
In the <head> section, add your Affonso tracking script:

import Script from 'next/script';

export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
    <html lang='en'>
      <head>
        <Script
          async
          defer
          src='https://affonso.io/js/pixel.min.js'
          data-affonso='YOUR_PUBLIC_PROGRAM_ID'
          data-cookie_duration='YOUR_COOKIE_DURATION'
          strategy='afterInteractive'
        />
      </head>
      <body>{children}</body>
    </html>
  );
}