Tag manager events

[Ghaleb-alnakhlani]

Hi @robindanzinger @onza

I am back again with a new question, In order to implement an event in the page I have to include this script in the head section

    <script async src="https://www.googletagmanager.com/gtag/js?id=G-xxxxxxxxx"></script>
    <script>
        window.dataLayer = window.dataLayer || [];
        function gtag(){dataLayer.push(arguments);}
        gtag('js', new Date());

        gtag('config', 'G-xxxxxxxxxx');
    </script>

After that i am able to add the window.gtag('event', .....)

Doing this the user will not be able to opt-out even if they did it will still track because the script will load whenever the page load. any idea how i can include that in the cookieconsent.js?

thank you

[robindanzinger]

@Ghaleb-alnakhlani , now you seem to use google analytics. Before you asked, how to setup google tag manager. The original script supportet Google Analytics. https://github.com/onza/CookieConsent/issues/4#issuecomment-769057247 If you want to support Google Analytics, you have to use the original script. If you want to support both, you have to add both codeblocks inside the enableGooglesitetag()-method.

This article might be interesting for you: https://www.analyticsmania.com/post/google-tag-manager-vs-google-analytics/

[Ghaleb-alnakhlani]

@robindanzinger now I feel bad about asking again. If you just know who I am dealing with you will excuse me. I have to use now google analytics 4 as well. From the article, I understood that GTM is not a replacement for GA it is an additional feature for GA. Does the original script supports google analytics 4? please can you provide a code snippet of having both scripts in the function enableGooglesitetag()?

thank you

[robindanzinger]

I think, the following script should work.

function enableGooglesitetag () { 
   window['ga-disable-' + window.cookieconsent.googlesitetag.gt_id] = false; 

   if (window.cookieconsent.googlesitetag.script_loaded) { 
     return; 
   } 

  (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','.........ID');

   const firstScriptElement = document.getElementsByTagName('script')[0]; 
   const gtScriptElement = document.createElement('script'); 
   gtScriptElement.async=true; 
   gtScriptElement.src="https://www.googletagmanager.com/gtag/js?id=" +window.cookieconsent.googlesitetag.gt_id; 
   firstScriptElement.parentNode.insertBefore(gtScriptElement, firstScriptElement); 

   window.dataLayer = window.dataLayer || []; 
   function gtag() { 
     window.dataLayer.push(arguments); 
   } 
   gtag('js', new Date()); 
   gtag('config', window.cookieconsent.googlesitetag.gt_id, { 'anonymize_ip': true }); 
   window.cookieconsent.googlesitetag.script_loaded = true; 
 } 

You have to set your GTM-id in the middle of the function: })(window,document,'script','dataLayer','.........ID');

And don't forget to set the gt_id (GoogleAnalyticsId): https://github.com/onza/CookieConsent#requirement-for-google-analytics-and-pardot

googlesitetag: { gt_id: 'UA-XXXXXXXXXX-X' },

[robindanzinger]

alternativ following script: Replace: YOUR_GTM_ID_XXX and googlesitetag: { gt_id: 'UA-XXXXXXXXXX-X' },

function enableGooglesitetag () { 
   window['ga-disable-' + window.cookieconsent.googlesitetag.gt_id] = false; 

   if (window.cookieconsent.googlesitetag.script_loaded) { 
     return; 
   } 

   const firstScriptElement = document.getElementsByTagName('script')[0]; 
   const gtScriptElement = document.createElement('script'); 
   gtScriptElement.async=true; 
   gtScriptElement.src="https://www.googletagmanager.com/gtag/js?id=" +window.cookieconsent.googlesitetag.gt_id; 
   firstScriptElement.parentNode.insertBefore(gtScriptElement, firstScriptElement); 
   const gtmScriptElement = document.createElement('script'); 
   gtmScriptElement.async=true; 
   gtmScriptElement.src="'https://www.googletagmanager.com/gtm.js?id=" + "YOUR_GTM_ID_XXX"; 
   gtScriptElement.parentNode.insertBefore(gtmScriptElement, gtScriptElement); 

   window.dataLayer = window.dataLayer || []; 
   function gtag() { 
     window.dataLayer.push(arguments); 
   } 
   gtag('js', new Date()); 
   gtag('config', window.cookieconsent.googlesitetag.gt_id, { 'anonymize_ip': true }); 
   gtag({'gtm.start': new Date().getTime(), event:'gtm.js'})
   window.cookieconsent.googlesitetag.script_loaded = true; 
 } 

[robindanzinger]

If you don't want to anonymize the ip, you have to remove { 'anonymize_ip': true}. Do you call the gtag-function from anywhere in your script? Then you have to move the function declaration outside of the function enableGooglesitetag

function gtag() { 
  window.dataLayer.push(arguments); 
} 
function enableGooglesitetag() {
  ...
}

[Ghaleb-alnakhlani]

Thank you @robindanzinger I have moved the gtag function outside because i have events which are called on different pages using window.gtag() I think it is working now i will leave the issue open for few days than i will close it if everything is working fine