Howto Integrate Google Analytics 4 With Hugo Website
I was thinking to integrate Google Analytics with Hugo-powered websites like my blog system, and the Google led me to this Gist: https://gist.github.com/zjeaton/42246742cdaf2fb46400d04c2eba9a8a
However, after reading through the partials my Clarify theme has, the partial of layout/partials/analytics.html has already covered the changes that Gist is trying to do.
1{{- with .Site.Params.ga_analytics }}
2<script async src="https://www.googletagmanager.com/gtag/js?id={{ . }}"></script>
3<script>
4 window.dataLayer = window.dataLayer || [];
5 function gtag(){dataLayer.push(arguments);}
6 gtag('js', new Date());
7 gtag('config', '{{ . }}');
8</script>
9{{- end -}}
10{{- with .Site.Params.baidu_analytics }}
11<script>
12 var _hmt = _hmt || [];
13 (function() {
14 var hm = document.createElement("script");
15 hm.src = "https://hm.baidu.com/hm.js?{{ . }}";
16 var s = document.getElementsByTagName("script")[0];
17 s.parentNode.insertBefore(hm, s);
18 })();
19</script>
20{{- end }}
21
22{{- if (site.Params.plausible_analytics.enable) }}
23<script async defer data-domain="{{ site.Params.plausible_analytics.websiteDomain }}"
24src='https://{{ default "plausible.io" site.Params.plausible_analytics.plausibleDomain }}/js/{{ default "plausible" site.Params.plausible_analytics.scritpName }}.js'>
25</script>
26{{- end }}
So, as a result, what I needed to do was to update the param of ga_analytics = "G-XXXXXXXX", and it worked perfectly fine as I could see the data in GA4 soon.