What You'll Have After This Guide

By the end of this 5-minute guide you will have a fully functional, GDPR-compliant cookie consent banner live on your website — complete with automatic Google Consent Mode v2 integration, a cookie policy, and a preference centre where users can change their choices at any time.

No coding required. Let's go.

CookieBeam Setup Steps

Create your CookieBeam account

Go to cookiebeam.com/sign-up and create a free account. Enter your website's URL during signup — CookieBeam will automatically scan your site to detect cookies and suggest categorizations.

Configure your banner appearance

In the Appearance tab, select your banner style (modal, bottom bar, or side panel), choose your brand colors, and set your font. The preview updates in real time. CookieBeam's default design is already optimized for GDPR compliance with equal-weight accept/reject buttons.

Review and customize cookie categories

The automatic scanner will have pre-populated your cookie categories. Review the detected cookies in the Cookies tab. Add any missed cookies and confirm each category's description. This content appears in your consent banner and cookie policy automatically.

Copy and install the embed code

Navigate to Setup → Embed Code. Copy the single line of JavaScript and paste it as the first script in your <head> tag — before any analytics, advertising, or other scripts. This ensures cookies are blocked before consent is given.

Verify your installation

Visit your website in a private/incognito browser window. You should see the CookieBeam banner immediately. Accept analytics only and then check your browser's DevTools → Application → Cookies to confirm only necessary and analytics cookies are set. Open a new incognito window and confirm the banner reappears.

index.html

<!-- Paste this as the FIRST script in your <head> tag -->
<!-- Replace YOUR_SITE_ID with your CookieBeam site ID -->
<script
  src="https://cdn.cookiebeam.com/cb.js"
  data-site-id="YOUR_SITE_ID"
  async
></script>

<!-- That's it! CookieBeam handles the rest:
  - Cookie consent banner
  - Google Consent Mode v2 signals
  - Cookie blocking until consent
  - Preference centre
  - Consent logging
-->

Placement Matters: First Script in Head

The CookieBeam script must be placed before any other scripts (Google Analytics, Meta Pixel, etc.) in your <head> tag. This is critical — if analytics scripts load before CookieBeam, they will set cookies before the user has consented, violating GDPR.

Platform-Specific Installation

CookieBeam works on every platform. Here is where to add the script on common CMS platforms:

WordPress: Appearance → Theme Editor → header.php, or use a plugin like 'Insert Headers and Footers'
Shopify: Online Store → Themes → Edit Code → Layout → theme.liquid, inside the <head> tag
Squarespace: Settings → Advanced → Code Injection → Header
Webflow: Project Settings → Custom Code → Head Code
Google Tag Manager: Create a Custom HTML tag with the CookieBeam script, trigger on All Pages, set sequence to fire before other tags

Post-Setup Verification Checklist

Banner appears on first visit in private browsing
Open an incognito/private window. The banner should show immediately before any page content interaction.
Only necessary cookies set before consent
In DevTools > Application > Cookies: before clicking anything, only cookiebeam_consent and session cookies should be present.
Analytics cookies set after accepting
After clicking 'Accept Analytics', Google Analytics cookies (_ga, _ga_*) should now appear.
Preference centre accessible
A floating icon or link should allow users to return to the preference centre and change their choices.
Google Consent Mode signals firing
In browser console, check dataLayer for consent_update events after user interaction.
Mobile banner tested on real device
Test on an actual mobile device. The banner should be fully usable without pinching or zooming.

You're Live!

Your CookieBeam cookie consent banner is now protecting you from GDPR violations and automatically managing Google Consent Mode v2 signals for your ad campaigns. Next steps: connect your Google Consent Mode v2 settings, set up Meta CAPI for server-side tracking, and explore your consent rate analytics in the CookieBeam dashboard.

Understanding Your CookieBeam Dashboard

Once your banner is live, the CookieBeam dashboard becomes your central hub for managing consent across your website. The dashboard is designed to give both non-technical website owners and developers at-a-glance insight into compliance status and consent performance. Here is a quick tour of the key sections you will use regularly.

Consent Rate

See what percentage of your visitors accept, reject, or partially accept cookies. Drill down by day, country, device type, and banner variant to understand what is driving consent decisions.

Cookie Scanner

CookieBeam crawls your site continuously and detects every cookie being set — including new ones added by third-party scripts. New cookies trigger an email alert so you can categorise and disclose them immediately.

Banner Preview

Preview your consent banner exactly as it will appear on desktop and mobile before publishing changes. Test different languages, colour schemes, and button layouts without affecting live visitors.

Integrations

Configure and verify your Google Consent Mode v2, Google Tag Manager, Meta Pixel, and other integrations. CookieBeam shows you whether each integration is correctly receiving consent signals.

Analytics

A privacy-safe analytics view of your consent funnel: impressions, interactions, accept/reject/close rates by page, by language, and over time. No cookies required — powered by server-side aggregation.

Consent Logs

A cryptographically verifiable log of every consent event recorded on your site — timestamp, visitor ID, consent choices, banner version, and jurisdiction. Export to CSV for GDPR audit responses.

Configuring Consent Categories

Out of the box, CookieBeam creates four consent categories matching the standard GDPR taxonomy: Strictly Necessary, Functional, Analytics, and Marketing. You can customise the name, description, and cookie list for each category to match the terminology your audience understands — and to accurately reflect the cookies your site actually sets.

Customising Consent Categories in CookieBeam

Navigate to Consent Categories in your dashboard

From the CookieBeam dashboard sidebar, click Banner → Consent Categories. You will see the four default categories, each showing the number of cookies currently assigned to it.

Edit the category name and description

Click Edit on any category. You can rename it (e.g. 'Performance & Analytics' instead of 'Analytics') and update the user-facing description. Write your descriptions in plain language — explain what these cookies do in terms a non-technical user understands, and why a visitor might choose to enable or decline them.

Add cookies to the category

Under Cookies in this category, click Add Cookie. Enter the cookie name, provider, purpose, and retention period. If CookieBeam's scanner has already detected the cookie, it will suggest a pre-filled entry from the cookie database. You can edit any field before saving.

Set retention information

For each cookie, enter the exact expiry period (e.g. '13 months', 'Session', '30 days'). This information is displayed in your auto-generated cookie policy and is required for GDPR transparency. CookieBeam flags any cookies where the retention period field is blank.

Translate category descriptions

If your site serves multiple languages, click the language selector next to each field to enter translations. CookieBeam serves the banner in the user's browser language automatically — but your custom descriptions need to be translated manually or with your preferred translation tool. For sites with many locales, CookieBeam's API allows bulk translation uploads.

Publish changes

Click Save & Publish. Changes to consent categories take effect immediately for new visitors. Returning visitors who have already made a consent choice will continue with their stored preferences until they re-interact with the banner or until your configuration version triggers a re-consent prompt.

Setting Up Google Consent Mode v2

CookieBeam ships with native Google Consent Mode v2 support — no manual gtag configuration is needed beyond the correct script order in your <head>. CookieBeam automatically sets all six consent signals (analytics_storage, ad_storage, ad_personalization, ad_user_data, functionality_storage, security_storage) to denied by default for EU visitors, then updates them to granted when the user accepts the relevant category.

The critical rule is script load order. The CookieBeam script must be initialised before your Google tag or GTM container. If Google's scripts load first, they will fire without consent signals and your Consent Mode implementation will be invalid. Here is the correct <head> order:

<!-- 1. CookieBeam: MUST be first -->
<script
  src="https://cdn.cookiebeam.com/cb.js"
  data-site-id="YOUR_SITE_ID"
  async
></script>

<!-- 2. Google tag (gtag.js) or GTM: MUST be after CookieBeam -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'G-XXXXXXXXXX');
</script>

CookieBeam's integration checker in the dashboard will automatically verify that Consent Mode signals are being received by Google Tag Manager and flag any ordering issues it detects during its next scan.

Troubleshooting: Banner Not Showing

If your CookieBeam banner is not appearing on your website after installation, work through the checklist below before contacting support. The most common cause is a script load failure due to a Content Security Policy (CSP) that blocks external scripts.

Banner Not Showing — Diagnosis Checklist

Open browser DevTools (F12) → Console tab. Check for any JavaScript errors referencing CookieBeam or <code>cb.js</code>.
Open DevTools → Network tab → reload the page. Filter for <code>cb.js</code>. Verify the script returns HTTP 200. A 404 means the Site ID is wrong; a 403 means a CSP or firewall is blocking the CDN.
Check your Content Security Policy (CSP) header or <code><meta></code> tag. Ensure <code>https://cdn.cookiebeam.com</code> is whitelisted under <code>script-src</code>.
Verify the <code>data-site-id</code> attribute on your script tag matches the Site ID shown in your CookieBeam dashboard under Settings → Site.
Check whether the banner has been suppressed for your IP. CookieBeam has an optional 'Hide banner for logged-in users' and 'Hide for these IP ranges' setting under Banner → Display Rules.
Check geolocation rules. By default, CookieBeam only shows the banner to visitors from the EEA and UK. If you are testing from outside these regions, enable Show banner globally in the dashboard for testing purposes.
Clear your browser cookies and local storage, then reload. If you previously accepted or declined, CookieBeam will not show the banner again until your consent record expires.

Monitoring Your Consent Rates

Your consent rate — the percentage of banner impressions that result in an 'Accept All' click — directly affects how much data your analytics and marketing tools can collect. A low consent rate is not inherently a compliance problem (users have the right to decline), but it can signal that your banner design or copy is creating friction or confusion.

CookieBeam's analytics dashboard lets you monitor consent rates broken down by date range, country, device, language, and page URL. This data is itself collected without cookies, using privacy-safe server-side aggregation — so you can analyse your consent funnel without needing consent to do so.

What a Healthy Consent Rate Looks Like

Industry averages vary significantly by sector, banner design, and user geography. As a benchmark: a well-designed CookieBeam banner typically achieves 55–75% accept rates in most European markets. German and Dutch users tend to decline at higher rates due to higher privacy awareness. If your accept rate falls below 40%, review your banner copy, button contrast, and the clarity of your 'Reject All' option — regulators require that declining consent be as easy as accepting it, but poor UX in either direction reduces trust.

What's Next: Advanced CookieBeam Configuration

With your basic CookieBeam setup running, the following guides cover more advanced configurations that can help you recover conversion data, improve ad performance, and handle more complex consent scenarios.

Server-Side GTM (sGTM) with CookieBeam

Move Google Tag Manager to a server-side container to improve site speed, extend first-party cookie lifetimes beyond ITP limits, and keep your consent signals in a trusted first-party context.

Meta Conversions API (CAPI) + CookieBeam

Send Meta Pixel events server-side using the Conversions API, with CookieBeam consent status passed as a signal to Meta so only consented events are used for ad personalisation.

Enhanced Conversions for Google Ads

Use CookieBeam's first-party consent data to power Google Ads Enhanced Conversions — hashing and sending consented customer data to improve conversion match rates.

Consent Rate Optimisation Guide

A/B test banner designs, copy, and button placements with CookieBeam's built-in experimentation features. Learn which changes improve consent rates without compromising GDPR validity.

Frequently Asked Questions

Does CookieBeam work with WordPress?

Yes. CookieBeam works on any website platform — WordPress, Shopify, Webflow, Squarespace, custom-built Next.js apps, and more. For WordPress, you can paste the script tag into your theme's header.php, use a plugin like WPCode to inject it globally, or install the official CookieBeam WordPress plugin, which handles script injection and provides a settings page within wp-admin.

Is CookieBeam compliant with GDPR, ePrivacy, and CCPA?

CookieBeam is designed to meet the requirements of GDPR (EU), the UK GDPR, the ePrivacy Directive, CCPA/CPRA (California), LGPD (Brazil), and other major privacy laws. The platform is built on the principle that consent must be freely given, specific, informed, and unambiguous — with withdrawal as easy as giving consent. CookieBeam has also achieved IAB TCF 2.2 certification, which is required if you use a TCF-integrated ad stack.

How long does installation actually take?

For most websites, the initial installation takes under 5 minutes: create an account, add your domain, copy the script tag into your site's <head>, and your banner is live. More time is required to fully customise categories, translate descriptions, and verify integrations like Google Consent Mode v2 — plan for 30–60 minutes for a thorough setup.

Will the CookieBeam script slow down my website?

CookieBeam's embed script is loaded with the async attribute, meaning it does not block page rendering. The script itself is under 10 KB gzipped and is served from a global CDN with edge caching. In Google PageSpeed Insights and Core Web Vitals tests, CookieBeam has negligible impact on LCP, FID, or CLS scores when installed correctly.

What happens to my consent records if I cancel my CookieBeam subscription?

Consent records are yours. Before cancelling, you can export your full consent log as a CSV from the dashboard under Consent Logs → Export. CookieBeam retains your data for 30 days after cancellation, during which you can reactivate your account or request a full data export. After 30 days, all data is permanently deleted in line with GDPR data retention obligations.

Does CookieBeam support multi-domain and subdomain setups?

Yes. CookieBeam supports multiple domains under a single account. You can configure separate banners for each domain with independent consent categories, analytics, and branding. For subdomain setups (e.g. shop.example.com and blog.example.com), CookieBeam can share consent records across the root domain so users only see the banner once — this is configurable under Settings → Domain Sharing.