EasyCookie

How to integrate EasyCookie with Webflow

Cookie consent management blocks tracking scripts until users grant permission. EasyCookie integrates with Webflow through custom code, letting you control exactly which scripts require consent and when they execute.

Add the consent banner script directly to your site, manage script blocking through Google Tag Manager (GTM), or configure manual blocking with consent attributes. A paid Webflow plan is required to access custom code functionality.

Install the consent banner script using Webflow Code Embeds

The basic EasyCookie embed script displays the consent banner but doesn't block tracking until you configure blocking methods.

Create your consent banner using the EasyCookie builder, then follow these steps:

1. Configure banner text, button labels, and consent categories (Absolutely necessary, Advertising, Analytical, Functional)
2. Choose layout (Banner with top/bottom positioning, Modal, or Popup) and apply color themes
3. Copy the embed script from the configurator dashboard by clicking Copy embed then Copy script
4. Paste in Webflow under Site Settings > Custom Code > Head Code section
5. Publish your site to activate the consent banner

The script displays the banner interface but doesn't block tracking scripts until you configure either Google Tag Manager integration or manual script blocking.

Configure consent blocking

Choose Google Tag Manager for automated consent management across all tags, or use manual script attributes for control over individual scripts.

Block scripts with Google Tag Manager

The GTM integration method provides consent management without modifying individual script tags. EasyCookie communicates consent state to Google Tag Manager, which controls when tags fire.

Create two GTM triggers in your GTM dashboard:

1. DOM Ready trigger that fires on all DOM readiness events
2. ConsentUpdate custom event trigger that listens for consent state changes

Assign triggers to analytics tags by locating your Google Analytics or Google Ads tag in GTM's Tags section, removing the default initialization trigger, and assigning the two newly created triggers. Under Advanced Settings > Consent Settings, enable "Require additional consent" for analytics_storage on GA4 tags. For advertising tags, also require ad_storage and personalization_storage.

This approach works with any tag type in GTM. EasyCookie sets consent state to "denied" by default, then updates to "granted" when users accept cookies.

Block scripts with manual attributes

The manual script blocking method modifies script tags in Webflow's custom code sections by changing their type attribute from text/javascript to text/plain and adding consent category identifiers. EasyCookie automatically switches the type back to text/javascript after consent is granted.

Before consent (blocked script):

<script type="text/plain" data-easycookie-analytics src="analytics.js"></script>

After consent (active script):

<script type="text/javascript" src="analytics.js"></script>

Available consent categories:

• data-easycookie-analytics for analytics tracking
• data-easycookie-advertising for advertising pixels
• data-easycookie-functional for functional/preference cookies

For dynamically loaded scripts like Facebook Pixel, listen for the easycookieUpdateConsent event and programmatically grant or revoke consent:

document.addEventListener('easycookieUpdateConsent', function(e) {
  if (e.detail.ad) {
    fbq('consent', 'grant');
  } else {
    fbq('consent', 'revoke');
  }
});

Apply these modifications in Webflow's Project Settings → Custom Code (in the Head Code or Footer Code section) or within Code Embed elements on specific pages.

What you can build

Integrating EasyCookie with Webflow enables privacy-compliant tracking through cookie consent management and script blocking while supporting Google Consent Mode v2 for maintaining marketing effectiveness.

• Multi-client compliance dashboards: Digital agencies managing portfolios of Webflow sites can centralize consent management across all client projects through EasyCookie's dashboard, creating customized banner templates matching each client's brand guidelines and maintaining separate consent logs per domain
• Privacy-preserving analytics implementations: Connect EasyCookie with Google Consent Mode v2 to maintain conversion measurement when users decline tracking cookies through conversion modeling that estimates conversions using aggregated data while respecting user choices about cookie acceptance
• Compliant e-commerce tracking: Build Webflow e-commerce stores that block advertising pixels (Facebook, Google Ads remarketing) and analytics trackers until users opt in while preserving essential shopping cart functionality through either Google Tag Manager integration or manual script blocking using consent attributes