Switch from gtag.js to Google Tag Manager Tag

[jacobthill]

Amy Hodge needs to understand how often users are clicking on various buttons, etc. on the SDR site. In order to track these events, we need to migrate from gtag.js to Google Tag Manager.

The tag currently installed (and installed on most/all of our sites)

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

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

is not a Google Tag Manager tag. It is a Global Site Tag (also called gtag.js or Google Tag). Google Tag Manager is similar but its actually a different system for managing tags. We don’t have Google Tag Manager set up on any sites (except DLME because QNL pushed for us to do so). The key differences are GTM allows you to manage all of your tags (not only Google tags), helps you keep them all organized in containers, and gives you a lot more power to create custom tags for tracking events without code changes.

Here are some instructions for migrating to minimize gaps in data collection which are outlined below

• Install the Tag Manager code on your site (devs): follow the instructions below (1 and 2)
• Add Events and Variables (GA service manager)
• Configure tags and their associated triggers in Tag Manager (GA service manager)
• Final migration swap (devs and GA service manager): must be done in sync to minimize gaps in data

1. Paste this code as high in the of the page as possible:

<!-- Google Tag Manager -->
<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','GTM-WXBCLV2G');</script>
<!-- End Google Tag Manager -->

2. Paste this code immediately after the opening tag:

<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-WXBCLV2G"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->