Documentation

Integration guide

Everything you need to install ConsentLab on your site in a few minutes.

1. Quick start

Setting up ConsentLab on your site takes less than two minutes. Four steps.

1
Create your account Sign up for free without a credit card. The free plan includes 5,000 sessions/month and unlimited domains.
2
Add your domain — From your dashboard, click + Add domain and enter your site URL (e.g. mysite.com).
3
Copy the snippet — ConsentLab automatically generates a custom <script> tag with your API key. One-click copy from your dashboard.
4
That's it. — Paste the snippet inside the <head> of your site. The banner shows up immediately for your visitors.

2. Installation

The same snippet works on every platform. Replace YOUR_API_KEY with the key generated in your dashboard.

HTMLHTML / Custom site

Paste the script tag inside the <head> of your HTML, before the closing </head>.

html
<script
  src="https://cdn.consentlab.eu/widget/v1/cookie-cmp.min.js"
  data-cc-key="YOUR_API_KEY"
  defer
></script>
Place the script as early as possible inside <head> so it initialises before the rest of your third-party tools.

WordPressWordPress

Two options:

  1. Install the official ConsentLab plugin from the WordPress directory, then go to Plugins → Settings → ConsentLab and paste your API key.
  2. Or paste the snippet directly via Appearance → Theme editor → header.php (or via a code injection plugin like Insert Headers and Footers).
html
<script
  src="https://cdn.consentlab.eu/widget/v1/cookie-cmp.min.js"
  data-cc-key="YOUR_API_KEY"
  defer
></script>

ShopifyShopify

The ConsentLab app for Shopify is coming soon to the Shopify App Store.

In the meantime, paste the snippet manually in Online Store → Themes → Edit code → layout/theme.liquid, just before the closing </head>.

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

Next.jsNext.js / React

Add the snippet inside the global <head> of your application.

App Router — app/layout.tsx:

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

Pages Router — pages/_document.tsx:

tsx
// 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/cookie-cmp.min.js"
          data-cc-key="YOUR_API_KEY"
          defer
        />
      </Head>
      <body>
        <Main />
        <NextScript />
      </body>
    </Html>
  );
}

WixSquarespaceWix / Squarespace

These platforms let you inject custom code via their settings:

  • Wix: Dashboard → Settings → Custom code → Add code → <head>
  • Squarespace: Settings → Advanced → Code injection → Header
html
<script
  src="https://cdn.consentlab.eu/widget/v1/cookie-cmp.min.js"
  data-cc-key="YOUR_API_KEY"
  defer
></script>

3. Configuration

All configuration is done from your ConsentLab dashboard — no code changes needed.

Visual customisation

Colours, position (bottom, top, centre), button text, default language — all configurable from the dashboard 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.

4. Script blocking

To make sure no third-party script runs before the visitor consents, ConsentLab supports native blocking via two HTML attributes.

How it works:

  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.
html
<script type="text/plain" data-cc="analytics">
  // Google Analytics code here
  gtag('js', new Date());
  gtag('config', 'G-XXXXXXXXXX');
</script>
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:

analyticsmarketingpreferences

5. DNS verification (optional)

DNS verification proves you own the domain where the widget is installed. It's recommended for all production sites.

Why verify?

Prevents a third party from using your API key on another domain. Adds a trust indicator in your dashboard.

How?

Add a TXT record 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.

Sample TXT record to add to your DNS:

dns
Type  : TXT
Name  : _consentlab.mysite.com
Value : consentlab-verify=xxxxxxxxxxxxxxxxxxxxxxxx
DNS propagation can take up to 48h, but is usually effective within an hour. Click Verify in your dashboard once the TXT record is added.

6. Technical FAQ

A question we don't cover here?

Our team replies within 24h, Monday to Friday.