Skip to content

Documentation

Installation guide

01 · Quick start

Four steps, two minutes

Setting up ConsentLab on your site takes less than two minutes. Free account, no credit card: 5,000 sessions per month and unlimited domains included.

  • Create your account · Free sign-up, no credit card, from the dashboard registration page.
  • Add your domain · From your dashboard, click + Add domain and enter your site URL (e.g. mysite.com).
  • Copy the snippet · ConsentLab automatically generates a custom <script> tag with your API key, one-click copy from the dashboard.
  • Paste it in the head · Paste the tag inside the <head> of your site: the banner shows up immediately for your visitors.

02 · Installation

One tag in the head

The same snippet works on every platform: replace YOUR_API_KEY with the key generated in your dashboard. The tag is in the right-hand column.

Paste the tag inside the <head> of your HTML, before the closing </head> and as early as possible: the widget initialises before the rest of your third-party tools.

Does your site serve a strict Content-Security-Policy (nonce-based)? Add the nonce attribute to the loader tag: the widget propagates it automatically.

Full ConsentLab + CSP guide

03 · Configuration

Colors, copy, position

All configuration is done from your ConsentLab dashboard, no code changes needed. The widget reads its configuration at load time.

  • Visual customisation · Colours, position (bottom, top, centre), button text, default language: all configurable without touching code.
  • Cookie categories · Configure the categories shown to your visitors: Necessary (always on), Analytics, Marketing and Preferences.
  • Multi-language · The widget automatically detects the visitor’s browser language. Translations available: FR, EN, DE, ES, IT, NL and more.
  • Google Consent Mode v2 · Enabled automatically, no configuration needed. ad_storage, analytics_storage, etc. signals are sent as soon as the visitor makes their choice.

04 · Script blocking

Two HTML attributes

To make sure no third-party script runs before the visitor consents, ConsentLab supports native blocking via two HTML attributes (example in the right-hand column).

  1. Replace type="text/javascript" with type="text/plain": the browser ignores the script.
  2. Add data-cc="analytics" (or marketing, preferences).
  3. ConsentLab automatically reactivates the script when the visitor accepts the matching category.

For scripts loaded via src=, combine type="text/plain" and data-cc= the same way: ConsentLab will restore the type and reload the script after consent.

Supported values for data-cc: analytics, marketing, preferences.

05 · DNS verification

One TXT record at your registrar

Optional but recommended for all production sites: DNS verification proves you own the domain where the widget is installed.

  • Why verify? · Prevents a third party from using your API key on another domain, and adds a trust indicator in your dashboard.
  • How? · Add the TXT record (right-hand column) in your domain’s DNS, at your registrar or DNS host.
  • Where to find the token? · In your dashboard: Settings → Subdomains → Verify. The unique token to copy is shown.

DNS propagation can take up to 48h, but is usually effective within an hour. Then click Verify in your dashboard.

06 · Technical FAQ

The usual blockers

The widget doesn’t show on my site

Check that the API key in the data-cc-key attribute matches the one in your dashboard, and that the domain is correctly added in your ConsentLab account. The developer console (F12) shows any network errors.

The widget shows but consents aren’t being saved

Make sure your domain is verified via DNS (section 05): without verification, the widget runs in local mode and doesn’t save choices server-side.

Google Analytics still loads before consent

Use the script blocking described in section 04: add type="text/plain" and data-cc="analytics" to your Google Analytics tag, ConsentLab will reactivate it after acceptance.

Does ConsentLab work with iframes (YouTube, Google Maps)?

Yes. Add data-cc="marketing" directly on the <iframe> tag: ConsentLab will block and restore the iframe source based on visitor consent.

My site uses a Content-Security-Policy, what do I do?

Allow cdn.consentlab.eu in your script-src and connect-src directives, plus the domains of the tools you enable on consent (e.g. www.googletagmanager.com and *.google-analytics.com for Google Analytics), otherwise your CSP will block them once the banner unblocks them. Strict nonce-based policy (no unsafe-inline): the widget propagates your page’s nonce automatically, see the ConsentLab + CSP tab.

Do you offer an API to automate compliance?

Yes: the public REST API /v1 (Business and Agency plans) exposes your consent statistics, register, banner configuration and cookie scans. See the Public API tab.

A question we don’t cover here?

Our team replies within 24h, Monday to Friday.

The tag

<script
  src="https://cdn.consentlab.eu/widget/v1/consentlab.min.js"
  data-cc-key="YOUR_API_KEY"
  defer
></script>

Next.js · App Router

// app/layout.tsx
export default function RootLayout({ children }) {
  return (
    <html lang="en">
      <head>
        <script
          src="https://cdn.consentlab.eu/widget/v1/consentlab.min.js"
          data-cc-key="YOUR_API_KEY"
          defer
        />
      </head>
      <body>{children}</body>
    </html>
  );
}

Next.js · Pages Router

// pages/_document.tsx
import { Html, Head, Main, NextScript } from 'next/document';

export default function Document() {
  return (
    <Html lang="en">
      <Head>
        <script
          src="https://cdn.consentlab.eu/widget/v1/consentlab.min.js"
          data-cc-key="YOUR_API_KEY"
          defer
        />
      </Head>
      <body>
        <Main />
        <NextScript />
      </body>
    </Html>
  );
}

Blocking a script

<script type="text/plain" data-cc="analytics">
  // Google Analytics code here
  gtag('js', new Date());
  gtag('config', 'G-XXXXXXXXXX');
</script>

DNS verification

Type  : TXT
Name  : _consentlab.mysite.com
Value : consentlab-verify=xxxxxxxxxxxxxxxxxxxxxxxx