Features Pricing Docs Security FAQ Log in EN PL
← Back to guides
N
SPA

Next.js / React

Difficulty: Medium Setup time: 3 min

Script in _document.tsx (Pages Router) or layout.tsx (App Router) with strategy=beforeInteractive.

01

Next.js App Router (Next 13+)

In app/layout.tsx add the inline Consent Mode stub + the loader, both with strategy=beforeInteractive:

import Script from 'next/script'

export default function RootLayout({ children }) {
  return (
    <html lang="en">
      <head>
        {/* Consent Mode v2 defaults - must run before any tag */}
        <Script id="consentlane-stub" strategy="beforeInteractive">{`
window.dataLayer=window.dataLayer||[];window.gtag=window.gtag||function(){window.dataLayer.push(arguments)};
gtag('consent','default',{ad_storage:'denied',ad_user_data:'denied',ad_personalization:'denied',analytics_storage:'denied',wait_for_update:500});
window.uetq=window.uetq||[];window.uetq.push('consent','default',{ad_storage:'denied'});
        `}</Script>
        <Script
          src="https://consentlane.com/v1/cl.js?s=YOUR_KEY"
          strategy="beforeInteractive"
        />
      </head>
      <body>{children}</body>
    </html>
  )
}
02

Next.js Pages Router

In pages/_document.tsx:

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

export default function Document() {
  return (
    <Html lang="en">
      <Head>
        {/* Consent Mode v2 defaults - must run before any tag */}
        <script dangerouslySetInnerHTML={{ __html: `
window.dataLayer=window.dataLayer||[];window.gtag=window.gtag||function(){window.dataLayer.push(arguments)};
gtag('consent','default',{ad_storage:'denied',ad_user_data:'denied',ad_personalization:'denied',analytics_storage:'denied',wait_for_update:500});
window.uetq=window.uetq||[];window.uetq.push('consent','default',{ad_storage:'denied'});
        ` }} />
        <script async src="https://consentlane.com/v1/cl.js?s=YOUR_KEY" />
      </Head>
      <body>
        <Main />
        <NextScript />
      </body>
    </Html>
  )
}
03

Re-open cookie settings

cl.js exposes a global window.cmpReopen() - you can call it from a footer link („Cookie settings"):

<a onClick={() => window.cmpReopen?.()}>Cookie settings</a>

Ready to try? The Free plan is enough to start.

Sign up