Explorar o código

feat: add support for Google Tag Manager + refactor GA to use gtag.js

GT (gtag.js) and GTM are the modern Google analytics solutions.

New `[marketing]` config section added to `params.toml`.

GT will fall back to site.GoogleAnalytics if the new `[marketing]` param
for GT/GA isn't specified, so currently no breaking changes.

May deprecate site.GoogleAnalytics in future.

Close #1349
George Cushen %!s(int64=5) %!d(string=hai) anos
pai
achega
f0ad140f07

+ 0 - 4
data/assets.toml

@@ -27,10 +27,6 @@
   version = "4.1.4"
   sri = "sha256-lqvxZrPLtfffUl2G/e7szqSvPBILGbwmsGE1MKlOi0Q="
   url = "https://cdnjs.cloudflare.com/ajax/libs/jquery.imagesloaded/%s/imagesloaded.pkgd.min.js"
-[js.autotrack]
-  version = "2.4.1"
-  sri = "sha512-HUmooslVKj4m6OBu0OgzjXXr+QuFYy/k7eLI5jdeEy/F4RSgMn6XRWRGkFi5IFaFgy7uFTkegp3Z0XnJf3Jq+g=="
-  url = "https://cdnjs.cloudflare.com/ajax/libs/autotrack/%s/autotrack.js"
 [js.gmaps]
   version = "0.4.25"
   sri = "sha256-7vjlAeb8OaTrCXZkCNun9djzuB2owUsaO72kXaFDBJs="

+ 7 - 0
exampleSite/config/_default/params.toml

@@ -243,3 +243,10 @@ plugins_js  = []
   engine = 2
   api_key = ""
   zoom = 15
+
+############################
+## Marketing
+############################
+[marketing]
+  google_analytics = ""
+  google_tag_manager = ""

+ 40 - 0
layouts/partials/marketing/google_analytics.html

@@ -0,0 +1,40 @@
+{{ $ga := site.Params.marketing.google_analytics | default site.GoogleAnalytics | default "" }}
+{{ $gtm := site.Params.marketing.google_tag_manager | default "" }}
+
+{{ if eq (getenv "HUGO_ENV") "production" | and $ga | and (not $gtm) }}
+
+{{ $gtag_config := cond site.Params.privacy_pack "{ 'anonymize_ip': true }" "{}" }}
+<script async src="https://www.googletagmanager.com/gtag/js?id={{$ga}}"></script>
+<script>
+  window.dataLayer = window.dataLayer || [];
+
+  function gtag() {
+      dataLayer.push(arguments);
+  }
+
+  function trackOutboundLink(url) {
+    gtag('event', 'click', {
+         'event_category': 'outbound',
+         'event_label': url,
+         'transport_type': 'beacon',
+         'event_callback': function () {
+           document.location = url;
+         }
+    });
+    console.debug("Outbound link clicked: " + url);
+  }
+
+  function onClickCallback(event) {
+    if ((event.target.tagName !== 'A') || (event.target.host === window.location.host)) {
+      return;
+    }
+    trackOutboundLink(event.target);  // Send GA event.
+  }
+
+  gtag('js', new Date());
+  gtag('config', '{{$ga}}', {{$gtag_config}});
+
+  // Outbound link tracking.
+  document.addEventListener('click', onClickCallback, false);
+</script>
+{{ end }}

+ 9 - 0
layouts/partials/marketing/google_tag_manager.html

@@ -0,0 +1,9 @@
+{{ if eq (getenv "HUGO_ENV") "production" | and site.Params.marketing.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','{{site.Params.marketing.google_tag_manager}}');
+</script>
+{{ end }}

+ 2 - 17
layouts/partials/site_head.html

@@ -117,23 +117,8 @@
     <link rel="stylesheet" href="{{ $css_bundle.RelPermalink }}">
   {{ end }}
 
-  {{ if not site.IsServer }}
-  {{ if site.GoogleAnalytics }}
-    <script>
-      window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
-      ga('create', '{{ site.GoogleAnalytics }}', 'auto');
-      {{ if site.Params.privacy_pack }}ga('set', 'anonymizeIp', true);{{ end }}
-      ga('require', 'eventTracker');
-      ga('require', 'outboundLinkTracker');
-      ga('require', 'urlChangeTracker');
-      ga('send', 'pageview');
-    </script>
-    <script async src="https://www.google-analytics.com/analytics.js"></script>
-    {{ if ($scr.Get "use_cdn") }}
-    {{ printf "<script async src=\"%s\" integrity=\"%s\" crossorigin=\"anonymous\"></script>" (printf $js.autotrack.url $js.autotrack.version) $js.autotrack.sri | safeHTML }}
-    {{ end }}
-  {{ end }}
-  {{ end }}
+  {{ partial "marketing/google_analytics" . }}
+  {{ partial "marketing/google_tag_manager" . }}
 
   {{ with .OutputFormats.Get "RSS" }}
   <link rel="alternate" href="{{.RelPermalink}}" type="application/rss+xml" title="{{site.Title}}">