Merge pull request #5067 from ssanchez/topics/gtm-environments-support

Pass through GTM environment params if present
gatsbyjs · Apr 24, 2018 · 9373041 · 9373041
2 parents a884ad0 + aafd777
commit 9373041
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 2 deletions.
diff --git a/packages/gatsby-plugin-google-tagmanager/README.md b/packages/gatsby-plugin-google-tagmanager/README.md
@@ -15,9 +15,14 @@ plugins: [
     resolve: `gatsby-plugin-google-tagmanager`,
     options: {
       id: "YOUR_GOOGLE_TAGMANAGER_ID",
+
       // Include GTM in development.
       // Defaults to false meaning GTM will only be loaded in production.
       includeInDevelopment: false,
+
+      // Specify optional GTM environment details.
+      gtmAuth: "YOUR_GOOGLE_TAGMANAGER_ENVIROMENT_AUTH_STRING",
+      gtmPreview: "YOUR_GOOGLE_TAGMANAGER_ENVIROMENT_PREVIEW_NAME",
     },
   },
 ];

diff --git a/packages/gatsby-plugin-google-tagmanager/src/gatsby-ssr.js b/packages/gatsby-plugin-google-tagmanager/src/gatsby-ssr.js
@@ -1,5 +1,5 @@
 import React from "react"
-import { stripIndent } from "common-tags"
+import { oneLine, stripIndent } from "common-tags"
 
 exports.onRenderBody = (
   { setHeadComponents, setPreBodyComponents },
@@ -9,6 +9,11 @@ exports.onRenderBody = (
     process.env.NODE_ENV === `production` ||
     pluginOptions.includeInDevelopment
   ) {
+
+    const environmentParamStr = (pluginOptions.gtmAuth && pluginOptions.gtmPreview) ? oneLine`
+      &gtm_auth=${pluginOptions.gtmAuth}&gtm_preview=${pluginOptions.gtmPreview}&gtm_cookies_win=x
+    ` : ``
+
     setHeadComponents([
       <script
         key="plugin-google-tagmanager"
@@ -17,7 +22,7 @@ exports.onRenderBody = (
             (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);
+            'https://www.googletagmanager.com/gtm.js?id='+i+dl+'${environmentParamStr}';f.parentNode.insertBefore(j,f);
             })(window,document,'script','dataLayer', '${pluginOptions.id}');`,
         }}
       />,
@@ -31,6 +36,8 @@ exports.onRenderBody = (
             <iframe
               src="https://www.googletagmanager.com/ns.html?id=${
                 pluginOptions.id
+              }${
+                environmentParamStr
               }"
               height="0"
               width="0"