Skip to content

Commit

Permalink
Add google tagmanager plugin
Browse files Browse the repository at this point in the history
  • Loading branch information
0x80 committed Jun 7, 2017
1 parent f10d752 commit ed883e0
Show file tree
Hide file tree
Showing 7 changed files with 129 additions and 0 deletions.
14 changes: 14 additions & 0 deletions packages/gatsby-plugin-google-tagmanager/.babelrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
{
"presets": [
["env", {
"targets": {
"browsers": ["last 2 versions", "safari >= 7"]
}
}],
"react"
],
"plugins": [
"transform-object-rest-spread",
"transform-flow-strip-types"
]
}
2 changes: 2 additions & 0 deletions packages/gatsby-plugin-google-tagmanager/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
/gatsby-browser.js
/gatsby-ssr.js
34 changes: 34 additions & 0 deletions packages/gatsby-plugin-google-tagmanager/.npmignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
# Logs
logs
*.log

# Runtime data
pids
*.pid
*.seed

# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov

# Coverage directory used by tools like istanbul
coverage

# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
.grunt

# node-waf configuration
.lock-wscript

# Compiled binary addons (http://nodejs.org/api/addons.html)
build/Release

# Dependency directory
# https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git
node_modules
*.un~
yarn.lock
src
flow-typed
coverage
decls
examples
20 changes: 20 additions & 0 deletions packages/gatsby-plugin-google-tagmanager/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
# gatsby-plugin-google-analytics

Easily add Google Tagmanager to your Gatsby site.

## Install
`npm install --save gatsby-plugin-google-tagmanager`

## How to use

```javascript
// In your gatsby-config.js
plugins: [
{
resolve: `gatsby-plugin-google-tagmanager`,
options: {
id: 'YOUR_GOOGLE_TAGMANAGER_ID',
},
},
]
```
1 change: 1 addition & 0 deletions packages/gatsby-plugin-google-tagmanager/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
// noop
21 changes: 21 additions & 0 deletions packages/gatsby-plugin-google-tagmanager/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
{
"name": "gatsby-plugin-google-tagmanager",
"description": "Gatsby plugin to add google tagmanager onto a site",
"version": "1.0.0-alpha19",
"author": "Thijs Koerselman <thijs@vauxlab.com>",
"devDependencies": {
"babel-cli": "^6.24.1"
},
"keywords": [
"gatsby",
"gatsby-plugin",
"google analytics",
"google tagmanager"
],
"license": "MIT",
"main": "index.js",
"scripts": {
"build": "babel src --out-dir .",
"watch": "babel -w src --out-dir ."
}
}
37 changes: 37 additions & 0 deletions packages/gatsby-plugin-google-tagmanager/src/gatsby-ssr.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
import React from "react"
import { stripIndent } from "common-tags"

exports.onRenderBody = (
{ setHeadComponents, setPreBodyComponents },
pluginOptions
) => {
if (process.env.NODE_ENV === `production`) {
setHeadComponents([
<script
dangerouslySetInnerHTML={{
__html: stripIndent`
<!-- 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', ${pluginOptions.id});</script>
<!-- End Google Tag Manager -->`,
}}
/>,
])

setPreBodyComponents([
<script
dangerouslySetInnerHTML={{
__html: stripIndent`
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=${pluginOptions.id}"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
`,
}}
/>,
])
}
}

0 comments on commit ed883e0

Please sign in to comment.