Home » Php » Placing gtag within a cookie consent script

Placing gtag within a cookie consent script

Posted by: admin September 16, 2018 Leave a comment

Questions:

Am attempting to implement a cookie consent dialogue which (in itelf) sets a cookie asking the user to either “decline” or “allow” cookies using the script from: https://cookieconsent.insites.com/download/

My site uses Google Analytics.

It does not seem to matter where I place the Google code.

In its present form “ga” , “_gat_gtag_UA…” , “gid” and “cookieconsent_status” are created when either “decline” or “allow” is clicked. but also an “unreachable code” error is reported in the Mozilla developer tools.

I did it this was because google says “ga_disable” must come before any calls to gtag(). (https://developers.google.com/analytics/devguides/collection/gtagjs/user-opt-out}

When the 2 google scripts are placed one after the other (either before or after the cookie consent script) the code error goes away, the 3 above “ga” cookies are written plus all google.com cookies are written, regardless of whether “decline” or “accept” is clicked.

The goal is to prevent any cookies on “decline” and write all cookies on “allow” with the options for the user to change his mind accordingly as the cookie consent script intends.

Any guidance would be appreciated.

<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type"
          content="text/html; charset=UTF-8" />
    <meta http-equiv="X-UA-Compatible"
          content="IE=edge,chrome=1" />

    <title>Example</title>
    <meta name="description"
          content="My description" />
    <meta name="viewport"
          content="width=device-width, initial-scale=1" />
    <meta name="language"
          content="en-us" />
    <meta name="robots"
          content="INDEX,FOLLOW" />
</head>

<body>
    <p>Hello World!</p>


<?php //  Permission to deline or allow cookies -- https://cookieconsent.insites.com/download/# ?>  

<link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.0.3/cookieconsent.min.css" />
<script src="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.0.3/cookieconsent.min.js"></script>

<script>
window.addEventListener("load", function(){
window.cookieconsent.initialise({
onInitialise: function (status) {
  var type = this.options.type;
  var didConsent = this.hasConsented();
  if (type == 'opt-in' && didConsent) {
    // enable cookies
        window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());

    gtag('config', 'UA-119555859-1');
  }

 if (type == 'opt-out' && !didConsent) {
    // disable cookies
        window['ga-disable-UA-119555859-1'] = true;    
  }
},

onStatusChange: function(status, chosenBefore) {
  var type = this.options.type;
  var didConsent = this.hasConsented();
  if (type == 'opt-in' && didConsent) {
    // enable cookies
        window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());

    gtag('config', 'UA-119555859-1');
  }
  if (type == 'opt-out' && !didConsent) {
    // disable cookies
    window['ga-disable-UA-119555859-1'] = true;    
  }
},

onRevokeChoice: function() {
  var type = this.options.type;
  if (type == 'opt-in') {
    // disable cookies
        window['ga-disable-UA-119555859-1'] = true;    
  }
  if (type == 'opt-out') {
    // enable cookies
        window.dataLayer = window.dataLayer || [];
        function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());

    gtag('config', 'UA-119555859-1');

}
},  "palette": {
    "popup": {
    "background": "#237afc"
    },
    "button": {
      "background": "#fff",
      "text": "#237afc"
    }
  },
  "theme": "classic",
  "position": "bottom-right",
  "type": "opt-in",
  "content": {
   "dismiss": "Decline Cookies",
   "link": "Learn more.",
    "href": "https://cookiesandyou.com/"
  }
 })});
</script>


<?php // Global site tag (gtag.js)  Second gtag script installed above in 'enable cookies' ?>

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-119555859-1"></script>


</body>
Answers: