πŸͺ Want help with cookie compliance or consent tracking?

Get expert support β†’

Cookie Banner Snippet – Drop-In Consent Compliance

Check Compliance

Add a fully functional, customisable cookie banner to your site in seconds. This lightweight code snippet helps you stay privacy-compliant without bulky plugins or complex setup. Supports basic opt-in/out logic, custom styling, and seamless integration with Google Tag Manager or other tag managers.

Add the Script to Google Tag Manager

1. Log in to Google Tag Manager‍
‍2. Click Tags β†’ New‍
‍3. Choose Tag Type: Custom HTML‍
‍4. Paste the code snippet (behind 'Show Code' below) into the HTML box
‍
‍5. Set the trigger to: All Pages (or target specific URLs if preferred)‍
‍6. Click Save, then Submit and Publish your container‍
‍7. Done! πŸŽ‰ Your cookie banner is now live on your site

For a faster setup, download the full Advanced Consent Mode script below and import it straight into your GTM container.

<script>
(function() {
  var consentCookieName = "cookieConsent";
  var config = {
    shortMessage: "We use cookies to improve your experience.",
    longMessage: "πŸͺ We use essential cookies to make our site work. We'd also like to use non-essential cookies to tell us how you're using our website and help us build better features.",
    bannerPosition: "bottom", // center or bottom
    acceptText: "Accept All",
    rejectText: "Fine-Tune",
    settingsText: "Manage Preferences",
    saveText: "Save Preferences",
    policyText: "View Cookie Policy",
    policyUrl: "/cookie-policy",
    backgroundColor: "#000",
    textColor: "#fff",
    buttonColor: "#f1c40f",
    expiresDays: 180
  };

  function setCookie(name, value, days) {
    var expires = "";
    if (days) {
      var d = new Date();
      d.setTime(d.getTime() + (days * 24 * 60 * 60 * 1000));
      expires = "; expires=" + d.toUTCString();
    }
    document.cookie = name + "=" + encodeURIComponent(value) + expires + "; path=/";
  }

  function getCookie(name) {
    var nameEQ = name + "=";
    var ca = document.cookie.split(';');
    for (var i = 0; i < ca.length; i++) {
      var c = ca[i].trim();
      if (c.indexOf(nameEQ) === 0) return decodeURIComponent(c.substring(nameEQ.length, c.length));
    }
    return null;
  }

  function parseConsent() {
    try {
      var c = getCookie(consentCookieName);
      return c ? JSON.parse(c) : null;
    } catch (e) {
      return null;
    }
  }

  function createBanner() {
    var style = document.createElement("style");
    style.innerHTML = "@media screen and (max-width: 767px) {" +
                      "  #cb-settings { display: none !important; }" +
                      "}";
    document.head.appendChild(style);

    var div = document.createElement("div");
    div.id = "cookie-banner";

    var message = config.shortMessage;
    if (window.innerWidth >= 768) {
      message = config.longMessage;
    }

    var content = "";
    if (config.bannerPosition === "center") {
      content =
        '<div style="text-align:center;color:' + config.textColor + ';">' +
          '<p style="margin:0 0 1rem;">' + message + '</p>' +
          '<div style="display:flex;flex-wrap:wrap;justify-content:center;gap:0.5rem;">' +
            '<button id="cb-accept" style="background:' + config.buttonColor + ';color:#000;border:none;padding:0.5rem 1rem;">' + config.acceptText + '</button>' +
            '<button id="cb-reject" style="background:#ccc;color:#000;border:none;padding:0.5rem 1rem;">' + config.rejectText + '</button>' +
            '<button id="cb-settings" style="background:#666;color:#fff;border:none;padding:0.5rem 1rem;">' + config.settingsText + '</button>' +
          '</div>' +
        '</div>';
    } else {
      content =
        '<div style="max-width:960px;margin:auto;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;color:' + config.textColor + ';">' +
          '<p style="flex:1;margin:0;">' + message + '</p>' +
          '<div style="display:flex;flex-wrap:wrap;gap:0.5rem;margin-top:0.5rem;">' +
            '<button id="cb-accept" style="background:' + config.buttonColor + ';color:#000;border:none;padding:0.5rem 1rem;">' + config.acceptText + '</button>' +
            '<button id="cb-reject" style="background:#ccc;color:#000;border:none;padding:0.5rem 1rem;">' + config.rejectText + '</button>' +
            '<button id="cb-settings" style="background:#666;color:#fff;border:none;padding:0.5rem 1rem;">' + config.settingsText + '</button>' +
          '</div>' +
        '</div>';
    }

    div.innerHTML = content;
    div.style.position = "fixed";
    div.style.background = config.backgroundColor;
    div.style.padding = "1rem";
    div.style.zIndex = "99999";
    div.style.left = "0";
    div.style.right = "0";

    if (config.bannerPosition === "center") {
      div.style.top = "50%";
      div.style.left = "50%";
      div.style.transform = "translate(-50%, -50%)";
      div.style.maxWidth = "90%";
      div.style.borderRadius = "8px";
    } else {
      div.style.bottom = "0";
    }

    document.body.appendChild(div);

    document.getElementById("cb-accept").onclick = function () {
      setConsent({ experience: true, measurement: true, marketing: true });
      removeBanner();
    };
    document.getElementById("cb-reject").onclick = function () {
      setConsent({ experience: false, measurement: false, marketing: false });
      removeBanner();
    };
    document.getElementById("cb-settings").onclick = function () {
      showPanel();
    };
  }


  function removeBanner() {
    var b = document.getElementById("cookie-banner");
    if (b) b.parentNode.removeChild(b);
  }

  function setConsent(obj) {
    setCookie(consentCookieName, JSON.stringify(obj), config.expiresDays);
    window.dataLayer = window.dataLayer || [];
    window.dataLayer.push({ event: "cookie_preferences_saved", cookieConsent: obj });
  }

  function showPanel() {
    var overlay = document.createElement("div");
    overlay.id = "cookie-panel";
    overlay.style.position = "fixed";
    overlay.style.top = 0;
    overlay.style.left = 0;
    overlay.style.right = 0;
    overlay.style.bottom = 0;
    overlay.style.background = "rgba(0,0,0,0.85)";
    overlay.style.color = "#fff";
    overlay.style.zIndex = "100000";
    overlay.style.padding = "2rem";
    overlay.style.overflowY = "auto";

  overlay.innerHTML =
    '<div style="max-width:600px;margin:auto;background:#111;padding:2rem;border-radius:8px;position:relative;">' +
      //'<a href="https://www.netimpression.co.uk/" target="_blank" style="position:absolute;top:16px;right:16px;">' +
      //  '<img src="https://i.imgur.com/NQpOuVP.png" alt="Net Impression Logo" style="max-width:80px;height:auto;" />' +
      //'</a>' +
      '<div style="position:absolute;top:16px;right:16px;font-size:12px;color:#aaa;">Developed by <a href="https://www.netimpression.co.uk/" target="_blank" style="color:#aaa;text-decoration:underline;">Net Impression</a></div>' +
      '<h2>Your Privacy Choices</h2>' +
      '<p>You can manage your consent preferences below. Some cookies are necessary and cannot be disabled.</p>' +

        '<label style="display:flex;justify-content:space-between;margin:1rem 0;">' +
          '<span>Necessary</span>' +
          '<input type="checkbox" checked disabled />' +
        '</label>' +

        '<label style="display:flex;justify-content:space-between;margin:1rem 0;">' +
          '<span>Experience</span>' +
          '<input type="checkbox" id="consent-experience" />' +
        '</label>' +

        '<label style="display:flex;justify-content:space-between;margin:1rem 0;">' +
          '<span>Measurement</span>' +
          '<input type="checkbox" id="consent-measurement" />' +
        '</label>' +

        '<label style="display:flex;justify-content:space-between;margin:1rem 0;">' +
          '<span>Marketing</span>' +
          '<input type="checkbox" id="consent-marketing" />' +
        '</label>' +

        '<div style="margin-top:2rem;display:flex;justify-content:space-between;align-items:center;">' +
          '<a href="' + config.policyUrl + '" target="_blank" style="color:' + config.buttonColor + ';text-decoration:underline;">' + config.policyText + '</a>' +
          '<div>' +
            '<button id="consent-save" style="background:' + config.buttonColor + ';color:#000;border:none;padding:0.5rem 1rem;margin-right:0.5rem;">' + config.saveText + '</button>' +
            '<button id="consent-cancel" style="background:#666;color:#fff;border:none;padding:0.5rem 1rem;">Cancel</button>' +
          '</div>' +
        '</div>' +
      '</div>';

    document.body.appendChild(overlay);

    var existing = parseConsent() || {};
    document.getElementById("consent-experience").checked = !!existing.experience;
    document.getElementById("consent-measurement").checked = !!existing.measurement;
    document.getElementById("consent-marketing").checked = !!existing.marketing;

    document.getElementById("consent-save").onclick = function () {
      var result = {
        experience: document.getElementById("consent-experience").checked,
        measurement: document.getElementById("consent-measurement").checked,
        marketing: document.getElementById("consent-marketing").checked
      };
      setConsent(result);
      removeBanner();
      document.body.removeChild(overlay);
    };

    document.getElementById("consent-cancel").onclick = function () {
      document.body.removeChild(overlay);
    };
  }

  if (!getCookie(consentCookieName)) {
    if (document.readyState === "loading") {
      document.addEventListener("DOMContentLoaded", createBanner);
    } else {
      createBanner();
    }
  }

  // === βœ… Console credit ===
  console.log('Code on this page was developed by www.netimpression.co.uk πŸš€');
  
})();
</script>

Optional button in footer for users to update their settings:

<button onclick="showPanel()" style="background:none;border:none;color:#0077cc;text-decoration:underline;cursor:pointer;">
  Cookie Settings
</button>


✨ This script was developed by
Net Impression - making analytics simpler, sharper, and free where it counts. Feel free to copy, share, or extend it - just leave the credit in the console!

If you want support staying GDPR compliant, or you’d like a cookie banner that actually works for your site and audience, reach out and let us know how we can support you.

Book A free consultation

Check Cookie Compliance

Enter a website URL to scan for cookies and third-party tracking scripts set before consent. Spot risky platforms like TikTok, Meta, Google & more.

Need help with compliance?

Not sure where to start?

Whether you need to fix your tracking, improve your reporting, or run better experiments, we help businesses of all sizes turn analytics and CRO into a real growth engine. Get in touch to see how better data and faster testing can accelerate your results.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.