CODEWITHSUNDEEP
javascripthtmlcookiesgoogle-analyticscookieconsent
Ben
Ben

Reputation: 21

How to fix opt-in solution for Google Analytics

I'm setting up a new website and want to track pageviews with Google Analytics. Since I live in the EU I need to comply with GDPR and implement a opt-in solution which allows user to allow or deny cookies before those start tracking. I've stumbled upon Cookie Consent and tried using its opt-in solution, but it doesn't seem to work. Even though the banner appears, Google Analytics won't start tracking after you click "Accept". I'd appreciate your help very much.

I've already tried this solution, but unfortunately it's not helping: https://github.com/osano/cookieconsent/issues/489

I've also unsuccessfully tried this code: https://www.dair-media.net/blog/google-analytics-mit-optin-implementieren/

<!-- Instead of 'UA-XXXXXXXXX-X' I will be using my individual tag -->
<script src="https://cdn.jsdelivr.net/npm/cookieconsent@3/build/cookieconsent.min.js"></script>
    <script>
    window.addEventListener("load", function(){
    window.cookieconsent.initialise({
      "palette": {
        "popup": {
          "background": "#dcdcdc",
          "text": "#000000"
        },
        "button": {
          "background": "#7fb2e5",
          "text": "#000000"
        }
      },
      "theme": "classic",
      "position": "bottom-left",
      "type": "opt-in",
      "content": {
        "message": "Some text",
        "dismiss": "Deny",
        "deny": "Deny",
        "allow": "Allow Cookies",
        "link": "Learn more",
        "href": "somelink"
      },
        onStatusChange: function(status, chosenBefore) {
         var type = this.options.type;
         var didConsent = this.hasConsented();
         if (type == 'opt-in' && didConsent) {
            window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
            ga('create', 'UA-XXXXXXXXX-X', 'auto');
            ga('set', 'anonymizeIp', true);
            ga('send', 'pageview');
            var gascript = document.createElement("script");
            gascript.async = true;
            gascript.src = "https://www.google-analytics.com/analytics.js";
            document.getElementsByTagName("head")[0].appendChild(gascript, document.getElementsByTagName("head")[0]);  
         }
         if (type == 'opt-out' && !didConsent) {
          window['ga-disable-UA-XXXXXXXXX-X'] = true;
         }
        },
        onRevokeChoice: function() {
         var type = this.options.type;
         if (type == 'opt-in') {
         window['ga-disable-UA-XXXXXXXXX-X'] = true;
         }
         if (type == 'opt-out') {
            window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
            ga('create', 'UA-XXXXXXXXX-X', 'auto');
            ga('set', 'anonymizeIp', true);
            ga('send', 'pageview');
            var gascript = document.createElement("script");
            gascript.async = true;
            gascript.src = "https://www.google-analytics.com/analytics.js";
            document.getElementsByTagName("head")[0].appendChild(gascript, document.getElementsByTagName("head")[0]);  

         }
        }
    })
});
</script>
    <script>
// Set to the same value as the web property used on the site
var gaProperty = 'UA-XXXXXXXXX-X';

// Disable tracking if the opt-out cookie exists.
var disableStr = 'ga-disable-' + gaProperty;
if (document.cookie.indexOf(disableStr + '=true') > -1) {
  window[disableStr] = true;
}

// Opt-out function
function gaOptout() {
  document.cookie = disableStr + '=true; expires=Thu, 31 Dec 2099 23:59:59 UTC; path=/';
  window[disableStr] = true;
  alert('Some alert');
}
</script>
</html>

If you open the page, there are no cookies which is of course what I want. But then, even though you click on "Allow cookies", they still won't appear.

Upvotes: 2

Views: 3987

Answers (2)

senyor
senyor

Reputation: 119

Opt-in cookie consent for Google Analytics see here

Upvotes: 5

Slipoch
Slipoch

Reputation: 785

hmm, maybe change onStatusChange to onInitialise ? throw a few alerts in and find out where it isn't working. are there any js errors in your browser's dev panel?

Upvotes: 0

Related Questions