Migrate to Google Analytics 4 (GA4)

[chalin]

This is part of a CNCF-wide effort to upgrade project websites to GA4 since Google has deprecated Universal Analytics (UA). For more details, see:

• Migrate CNCF websites to GA4 cncf/techdocs#108, including reference to:
  • A suggested migration process,
    which we've used to migrate a few CNCF projects already.

Tasks: stage 1 (no code changes are necessary)

• Create a GA4 site tag under the CNCF projects account.
  The new GA4 stream measurement ID is: G-80ZM8LGB96
• Connect to the GA4 site tag from the UA tag.

Tasks: stage 1b - upgrade to use gtag.js

• Upgrade website to use gtag.js library - Switch to use of gtag.js library for analytics #2207
• Use GA4 setup assistant to "reconnect" the two tags. Can't use the GA4 setup assistant to connect site tags from different accounts it would seem.
• Confirm that the GA4 site tag is receiving events
• Confirm that the UA site tag, UA-58468480-1, is still receiving events

Tasks: stages 2 & 3

• Connect UA ID from GA4 site tag
• Configure GA4 ID through Netlify snippet injection, "Google Analytics 4 - only in production", just before </head>:

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

• Disconnect to the GA4 site tag from the UA tag
• Confirm that the GA4 site tag is receiving events and that the UA site tag, UA-58468480-1, is still receiving events:

  

Related

• Migrate to Google Analytics 4 (GA4) promcon/website#245
• Followup: Drop Google Universal Analytics (UA) code #2234

More:

• Analytics: resolve redundant-hostnames warning #2208
• Enable analytics for the production deploys only #2209
• SEO: non-production deploys should not be indexable #2210

/cc @nate-double-u @caniszczyk

---

Current website analytics info:

• UA site tags:
  • UA-58468480-1, main and actively used tag.
  • UA-58468480-2: a tag planned for use over a separately deployed blog, but it seems that it never used in production AFAICT, only during test deploys from 2015-2016 (GA screenshot to be added shortly).
  • UA-58468480-3 is the tag actively used for promcon.io

Hugo layout relevant for the main tag:

• docs/layouts/footer.html

  Lines 9 to 18 in 918a965

  	<!-- Google Analytics -->
  	<script>
  	(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  	(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  	m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  	})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
  	ga('create', 'UA-58468480-1', 'auto');
  	ga('send', 'pageview');
  	</script>

---

Previous issue on this topic: #2175.

[chalin]

@bwplotka @RichiH @juliusv: can one of you grant me access to your UA analytics account?

Note that we'll be creating the new GA4 site tag under the CNCF analytics account.

[chalin]

I'll also either need access to your Netlify account, or have someone able to add an environment variable for me when the time comes (stage 2).

[juliusv]

@chalin Sure, could you let me know your email address for both of these? Feel free to send to julius.volz@gmail.com.

[LKaemmerling]

Hello @juliusv, @chalin and the rest,

I'm sure this is not the right place, but I wanted to bring to your attention that Google Analytics is not a privacy-friendly service. Would you consider moving to privacy first analytics solution like https://usefathom.com/? This would bring a lot of benefits for users, as it is faster than Google Analytics and also respects the privacy of the users.

[juliusv]

@LKaemmerling Well personally, I totally agree and only use plausible.io these days, which also aims to be a GDPR-compatible and very ligh-weight alternative to GA.

However, it seems like the LF / CNCF uses GA to track all their different project websites. But maybe you can convince them to switch at some point :)

[chalin]

seems like the LF / CNCF uses GA to track all their different project websites.

Right. For the moment, the CNCF will continue using GA.

[chalin]

Migration stages 2 & 3 are complete. GA4 ID is now setup via snippet injection.