CookiePilot

Install CookiePilot and gate every tracker on consent

Load a consent-default stub first, the banner next, and your trackers last. Pick the path that matches how your scripts are loaded.

Start freeRead the docs

Choose your installation path

1Method

Direct in the <head>

Recommended when GA4 or Meta are injected by plugins and you want one place to control them.

Steps

  1. 1Paste the consent-default stub at the very top of <head>, with every category set to denied.
  2. 2Add the CookiePilot banner script right after the stub.
  3. 3Move GA4, Meta, and other trackers below the banner and load them only after consent.
  4. 4Redeploy and hard-refresh so the new order is served.
2Method

Through Google Tag Manager

Recommended when your tags already live in a GTM container.

Steps

  1. 1Keep the consent-default stub in <head>, before the GTM container.
  2. 2Load the CookiePilot loader once: either directly after the consent-default stub in <head>, or as a single Custom HTML tag that fires on Consent Initialization. Never load both.
  3. 3Gate each GTM tag on the matching consent, so nothing fires before Accept.
  4. 4Remember: GTM does not control trackers loaded outside it by CMS plugins. Move those into GTM or gate them directly.
3Method

CMS plugin or module

Recommended only when a documented CookiePilot integration exists for your specific platform and you prefer to set it up from the admin panel.

Steps

  1. 1First confirm that a documented CookiePilot integration exists for your platform; if it does not, use the direct <head> or GTM instructions instead.
  2. 2Check the generated page source: the consent-default stub and the CookiePilot banner must appear before any trackers. If the order is wrong, fix it with the direct guide.
  3. 3Check every separate analytics or marketing plugin: each still needs to read CookiePilot consent before it loads.
  4. 4Disable any plugin that fires its own scripts without a consent check.
4Method

Mixed sources

Recommended when trackers come from several places at once (theme, plugins, GTM, hardcoded tags).

Steps

  1. 1Inventory every script source: theme, plugins, GTM, and hardcoded tags.
  2. 2Keep only one consent-default stub and one cookiepilot.js loader across all sources, and remove any duplicate so nothing loads twice.
  3. 3Gate every source on the matching consent category.
  4. 4Re-scan after any change to catch a new script that slipped in ungated.

Safe code examples

Paste these blocks in the order shown. Replace the YOUR_* placeholders with your own values.

Correct load order

  1. 1Paste the consent-default stub at the very top of <head>, with every category set to denied.
  2. 2Add the CookiePilot banner script right after the stub.
  3. 3Move GA4, Meta, and other trackers below the banner and load them only after consent.
1. consent-default stub
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){ dataLayer.push(arguments); }
  gtag('consent', 'default', {
    ad_storage: 'denied',
    analytics_storage: 'denied',
    ad_user_data: 'denied',
    ad_personalization: 'denied',
    functionality_storage: 'denied',
    personalization_storage: 'denied',
    security_storage: 'granted',
    wait_for_update: 500,
  });
</script>
2. CookiePilot banner
<script async
  src="https://cdn.cookiepilot.io/cookiepilot.js"
  data-cpkey="YOUR_SITE_KEY"
></script>
3. GA4
<script>
  window.addEventListener('cookiepilot:consent', function(event) {
    var consent = event.detail || {};
    if (!consent.analytics || window.__cookiepilotGa4Loaded) return;
    window.__cookiepilotGa4Loaded = true;
    var ga = document.createElement('script');
    ga.async = true;
    ga.src = 'https://www.googletagmanager.com/gtag/js?id=' +
      encodeURIComponent('YOUR_GA4_ID');
    ga.onload = function() {
      gtag('js', new Date());
      gtag('config', 'YOUR_GA4_ID');
    };
    document.head.appendChild(ga);
  });
</script>
3. GTM
<script>
  (function(w,d,s,l,i){
    w[l]=w[l]||[];
    w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});
    var f=d.getElementsByTagName(s)[0],j=d.createElement(s),
      dl=l!='dataLayer'?'&l='+l:'';
    j.async=true;
    j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;
    f.parentNode.insertBefore(j,f);
  })(window,document,'script','dataLayer','YOUR_GTM_ID');
</script>

Installing the banner does not block your scripts by itself

CookiePilot shows the banner and records consent, but it cannot silently block scripts it does not control. Any tracker loaded by a theme, plugin, or GTM tag keeps firing until you gate it on consent. Treat each source separately and confirm it stays silent before consent.

Verify in a clean session

  • Before consent

    Open the site in a fresh private window. Before you click anything, no analytics or marketing script should run and no non-essential cookie should be set.

  • After Reject

    Click Reject. Reload and confirm the trackers still do not load and no non-essential cookie appears.

  • After Accept

    Click Accept. Confirm the trackers now load and their cookies appear, matching the categories you accepted.

Ready to install in minutes?

Create a project, copy your site key, and gate every tracker on real consent.

Start freeRead the docs