Add support for Google Analytics v4

gohugoio · Mar 3, 2021 · ba16a14 · ba16a14
1 parent 782c79a
commit ba16a14
Show file tree

Hide file tree

Showing 6 changed files with 45 additions and 10 deletions.
diff --git a/docs/content/en/about/hugo-and-gdpr.md b/docs/content/en/about/hugo-and-gdpr.md
@@ -92,6 +92,9 @@ respectDoNotTrack
 useSessionStorage
 : Enabling this will disable the use of Cookies and use Session Storage to Store the GA Client ID.
 
+{{% warning %}}
+`useSessionStorage` is not supported when using Google Analytics v4 (gtag.js).
+{{% /warning %}}
 ### Instagram
 
 simple

diff --git a/docs/content/en/templates/internal.md b/docs/content/en/templates/internal.md
@@ -27,14 +27,20 @@ While the following internal templates are called similar to partials, they do *
 
 ## Google Analytics
 
-Hugo ships with internal templates for Google Analytics tracking, including both synchronous and asynchronous tracking codes.
+Hugo ships with internal templates for Google Analytics tracking, including both synchronous and asynchronous tracking codes. As well as support for both v3 and v4 of Google Analytics.
 
 ### Configure Google Analytics
 
 Provide your tracking id in your configuration file:
 
+**Google Analytics v3 (analytics.js)**
 {{< code-toggle file="config" >}}
-googleAnalytics = "UA-123-45"
+googleAnalytics = "UA-PROPERTY_ID"
+{{</ code-toggle >}}
+
+**Google Analytics v4 (gtag.js)**
+{{< code-toggle file="config" >}}
+googleAnalytics = "G-MEASUREMENT_ID"
 {{</ code-toggle >}}
 
 ### Use the Google Analytics Template
@@ -50,6 +56,8 @@ You can then include the Google Analytics internal template:
 {{ template "_internal/google_analytics_async.html" . }}
 ```
 
+When using Google Analytics v4 use `_internal/google_analytics.html`.
+
 A `.Site.GoogleAnalytics` variable is also exposed from the config.
 
 ## Disqus

diff --git a/hugolib/embedded_templates_test.go b/hugolib/embedded_templates_test.go
@@ -110,7 +110,7 @@ Disqus:
 	// Gheck GA regular and async
 	b.AssertFileContent("public/index.html",
 		"'anonymizeIp', true",
-		"'script','https://www.google-analytics.com/analytics.js','ga');\n\tga('create', 'ga_id', 'auto')",
+		"'script','https://www.google-analytics.com/analytics.js','ga');\n\tga('create', 'UA-ga_id', 'auto')",
 		"<script async src='https://www.google-analytics.com/analytics.js'>")
 
 	// Disqus

diff --git a/hugolib/testhelpers_test.go b/hugolib/testhelpers_test.go
@@ -249,7 +249,7 @@ const commonConfigSections = `
 [services.disqus]
 shortname = "disqus_shortname"
 [services.googleAnalytics]
-id = "ga_id"
+id = "UA-ga_id"
 
 [privacy]
 [privacy.disqus]

diff --git a/tpl/tplimpl/embedded/templates.autogen.go b/tpl/tplimpl/embedded/templates.autogen.go
diff --git a/tpl/tplimpl/embedded/templates/google_analytics.html b/tpl/tplimpl/embedded/templates/google_analytics.html
@@ -1,6 +1,17 @@
 {{- $pc := .Site.Config.Privacy.GoogleAnalytics -}}
-{{- if not $pc.Disable -}}
-{{ with .Site.GoogleAnalytics }}
+{{- if not $pc.Disable }}{{ with .Site.GoogleAnalytics -}}
+{{ if hasPrefix . "G-"}}
+<script async src="https://www.googletagmanager.com/gtag/js?id={{ . }}"></script>
+<script>
+{{ template "__ga_js_set_doNotTrack" $ }}
+if (!doNotTrack) {
+	window.dataLayer = window.dataLayer || [];
+	function gtag(){dataLayer.push(arguments);}
+	gtag('js', new Date());
+	gtag('config', '{{ . }}', { 'anonymize_ip': {{- $pc.AnonymizeIP -}} });
+}
+</script>
+{{ else if hasPrefix . "UA-" }}
 <script type="application/javascript">
 {{ template "__ga_js_set_doNotTrack" $ }}
 if (!doNotTrack) {
@@ -26,8 +37,9 @@
 	ga('send', 'pageview');
 }
 </script>
-{{ end }}
 {{- end -}}
+{{- end }}{{ end -}}
+
 {{- define "__ga_js_set_doNotTrack" -}}{{/* This is also used in the async version. */}}
 {{- $pc := .Site.Config.Privacy.GoogleAnalytics -}}
 {{- if not $pc.RespectDoNotTrack -}}