CookiezyCookiezy
ProductPlatformsDocsPricingBlogContact
Platform page

Cookie Consent for Next.js

Cookiezy gives Next.js teams a modern consent layer that fits App Router builds, server-rendered pages, and localized marketing sites. The packaged Next.js flow uses the same `plain-html` adapter files shipped in `cookiezy-platform-core.zip`, but integrates them through a Next-specific root layout pattern and relies on registered hostnames for full runtime mode.

Start freeRead docs

Built for Next.js teams that care about performance, consent state, and implementation quality.

Cookie banner preview

Lightweight. Fast. Clear by default.

Delivery lane

How this adapter is delivered today

This page shows the current delivery lane for the adapter and separates the live channel from planned standalone or marketplace lanes.

Current delivery

Next.js adapterIncluded in Platform CoreActive
Cookiezy

Lightweight consent platform for modern websites.

Product

FeaturesPlatformsPricingDocsBlogContact

Legal

Cookie PolicyPrivacy PolicyTerms

Language

Privacy controls

© 2026 Cookiezy. All rights reserved.

Cookie consent. Done easy.

Lightweight consent that keeps your site fast and your data intact.

Necessary
Analytics
Marketing
After purchase

What the Next.js package includes

After account access is active you download `cookiezy-platform-core.zip`. For Next.js you use the same `plain-html` adapter files from `packages/adapters/plain-html/` and the shared core assets from `packages/core/dist/`. The canonical adapter entry file is `cookiezy-plain-adapter.js`.

  • • `packages/adapters/plain-html/cookiezy-plain-adapter.js`
  • • `packages/core/dist/cookie-consent.js`
  • • `packages/core/dist/cookie-consent-ui.js`
  • • `packages/core/dist/cookie-consent-scanner.js`
  • • `packages/core/dist/cookie-consent.css`
  • • `packages/adapters/plain-html/example.html` as the reference integration pattern
Cookiezy Next.js setup screenshot showing root layout bootstrap, verify URL, and policy audit wiring.
Reference view: Next.js rollout loads the plain adapter from the root layout and validates each live hostname.
Step 1

Copy the canonical adapter files into the Next.js public folder

Extract `cookiezy-platform-core.zip` and place `cookiezy-plain-adapter.js` plus the shared core files into `public/` so they can be loaded from the root layout across all routes and locales.

Code snippet

public/cookiezy-plain-adapter.js
public/cookie-consent.js
public/cookie-consent-ui.js
public/cookie-consent-scanner.js
public/cookie-consent.css
Step 2

Load and boot Cookiezy from app/layout.tsx

Add the CSS and scripts to your root layout, then boot the plain adapter with the locale, policy route, and issued licensing values you want to use. This keeps the consent layer available on every App Router page. Important: boot the adapter before loading `cookie-consent.js`, because the core runtime verifies the license immediately on load. If `license.siteKey` or `license.verifyUrl` are missing, or if the core script runs before `CookiezyPlainAdapter.boot(...)`, the runtime will stay in restricted mode with `license_not_configured`.

Code snippet

<link rel="stylesheet" href="/cookie-consent.css" />
<script src="/cookiezy-plain-adapter.js"></script>
<script>
  window.CookiezyPlainAdapter.boot({
    locale: "en",
    storageKey: "cookiezy_next_v1",
    policyUrl: "/en/cookie-policy",
    theme: { layout: "bottom-right", themeClass: "" },
    license: {
      siteKey: "ck_live_replace_me",
      verifyUrl: "https://cookiezy.com/api/licensing/verify",
      billingUrl: "https://cookiezy.com/en/billing"
    },
    texts: {}
  });
</script>
<script src="/cookie-consent.js"></script>
<script src="/cookie-consent-ui.js"></script>
<script src="/cookie-consent-scanner.js"></script>
Step 3

Register the live hostname, settings link, and policy audit

Register every live hostname in Cookiezy billing before publish so runtime verification can return `allowed: true`. After the scripts load, register the footer settings link and mount the cookie audit on the policy page. Then test homepage, pricing, and at least one localized route in a clean session.

Code snippet

window.CookiezyPlainAdapter.registerSettingsLink(document);

if (window.location.pathname === '/en/cookie-policy') {
  window.CookiezyPlainAdapter.mountAudit(document);
}

const consent = window.Cookiezy?.getConsent();
if (consent?.analytics) {
  startAnalytics();
}
Cookie scan included

Add a live cookie audit to your Next.js policy page

Cookiezy can scan the current browser session on the implemented site and display detected cookies with category, provider, purpose or description, and duration. In Next.js, mount the audit only on the policy route so the page can show what changed after a visitor accepts, rejects, or updates consent.

Cookie audit

Live cookie scan for this browser session

This audit reads the cookies currently visible on the domain in your browser and maps known cookies to categories and purposes. Re-scan after changing consent to verify what stays active.

How Cookiezy handles cookies on this site

Necessary cookies stay active so the site, login flow, and consent preferences keep working. Optional categories can be enabled or disabled by the visitor through Cookiezy settings.

0 Detected cookies
No browser cookies are currently visible on this domain.

This scan reflects the current browser session and the current state of consent on this device.

Cookie categories used on the site

Necessary

Always activeNo cookie detected

Required for security, routing, authentication, and storing the consent choice itself.

Analytics

Consent blockedNo cookie detected

Used to understand traffic and site usage when the visitor has granted analytics consent.

Marketing

Consent blockedNo cookie detected

Reserved for advertising, retargeting, and campaign tracking when marketing consent is granted.

Features

Consent features for modern Next.js websites

A better fit for teams using App Router, localized routes, and performance-sensitive pages.

App Router friendly

A practical consent layer for modern Next.js structures and route-driven experiences.

Localized route support

Works well with locale-based URL structures and policy page routing.

Policy page audit

Mount the cookie audit on the policy page using the same plain adapter helpers used by custom frontends.

Lightweight runtime

A stronger fit for performance-conscious sites than heavier banner tooling.

Ready to roll out

Use Cookiezy on your Next.js site

Add a consent layer that feels aligned with the way modern Next.js products are actually built.

FAQ

Next.js cookie consent FAQ

Helpful answers for teams evaluating consent management in Next.js.

Which ZIP should I use for Next.js?

Use `cookiezy-platform-core.zip` and integrate the `plain-html` adapter files from `packages/adapters/plain-html/` together with the shared core files in `packages/core/dist/`.

Where should I load Cookiezy in Next.js?

Load it from the root app layout so the consent layer is available across all routes and locales, and make sure `CookiezyPlainAdapter.boot(...)` runs before `cookie-consent.js`.

What is the difference between Next.js and headless here?

Next.js is the framework-specific integration path. Headless describes a more generic custom frontend architecture. Both currently use the same base `plain-html` adapter files, but Next.js should follow the root layout and route-aware setup shown in the Next.js guide.

Can Cookiezy support localized Next.js sites?

Yes. It fits locale-based routing well, including cases where policy pages differ by language.

How do I show the cookie audit on the policy page?

Call `window.CookiezyPlainAdapter.mountAudit(document)` on the policy route after the scanner script is loaded.

What happens if billing is inactive or the hostname is not registered?

The Next.js runtime should fall back to necessary-only restricted mode. Optional analytics, marketing, and premium runtime behavior remain blocked until the account is active and the hostname is allowed.