Implement Gatsby plugin configuration for Google's gtag.js library

Google Analytics (1) is a stable and proven service with a lot of useful (configurable) features and a reliable persistence. Nord Docs uses the latest and recommended `gtag.js` (2) library that optionally allows, next to Google Analytics itself, the integration of almost all Google Marketing services like e.g. Google Tag Manager (3). The library is integrated through gatsby-plugin-google-gtag (4). References: (1) https://marketingplatform.google.com/about/analytics (2) https://developers.google.com/analytics/devguides/collection/gtagjs (3) https://developers.google.com/tag-manager (4) https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-google-gtag Associated epic: GH-86 GH-87
nordtheme · Dec 18, 2018 · dc8b701 · dc8b701
1 parent b520d50
commit dc8b701
Showing 1 changed file with 29 additions and 1 deletion.
diff --git a/gatsby-config.js b/gatsby-config.js
@@ -21,7 +21,8 @@ const {
   BASE_DIR_CONTENT,
   BASE_DIR_ASSETS_IMAGES,
   BASE_DIR_CONFIG,
-  BASE_DIR_PAGES
+  BASE_DIR_PAGES,
+  GOOGLE_UNIVERSAL_ANALYTICS_TRACKING_ID
 } = require("./src/config/internal/constants");
 const { BASE_PUBLIC_URL } = require("./src/config/routes/constants");
 
@@ -78,6 +79,33 @@ module.exports = {
         name: "pages",
         path: `${__dirname}/${BASE_DIR_PAGES}/`
       }
+    },
+    {
+      resolve: "gatsby-plugin-google-gtag",
+      options: {
+        /* The tracking IDs for all used "Google Marketing" products. */
+        trackingIds: [GOOGLE_UNIVERSAL_ANALYTICS_TRACKING_ID],
+
+        /* The configuration that gets passed to the `gtag.js`'s `config` command. */
+        /* eslint-disable-next-line babel/camelcase */
+        gtagConfig: { anonymize_ip: true },
+
+        pluginConfig: {
+          /*
+           * Put the `gtag.js` tracking script in the HTML `<head>` instead of the `<body>` as recommended by Google.
+           *
+           * @see https://developers.google.com/analytics/devguides/collection/gtagjs
+           */
+          head: true,
+
+          /*
+           * Respect the 'Do Not Track' HTTP header.
+           *
+           * @see https://en.wikipedia.org/wiki/Do_Not_Track
+           */
+          respectDNT: true
+        }
+      }
     }
   ]
 };