Add Google Tag Manager (GTM) to your nuxt.js application. This plugins automatically sends first page and route change events to GTM.
- Add
@nuxtjs/google-tag-manager
dependency using yarn or npm to your project - Add
@nuxtjs/google-tag-manager
tomodules
section ofnuxt.config.js
modules: [
['@nuxtjs/google-tag-manager', { id: 'GTM-XXXXXXX' }],
]
- Required
- Can be String in form of
GTM-XXXXXXX
- Can be function returning Promise or String:
// Returns Promise
id: () => {
return axios.get('http://example.com/')
.then(({ data }) => {
return data.gtm_id
})
}
// Returns String
const code = '1234567'
id: () => {
return 'GTM-' + code
}
{
id: 'GTM-XXXXXXX',
layer: 'dataLayer',
pageTracking: false,
respectDoNotTrack: false,
dev: true, // set to false to disable in dev mode
query: {
// query params...
gtm_auth: '...',
gtm_preview: '...',
gtm_cookies_win: '...'
},
scriptURL: '//example.com',
noscriptURL: '//example.com'
}
You can optionally set pageTracking
option to true
to track page views.
This is disabled by default to prevent double events when using alongside with Google Analytics so take care before enabling this option.
You can push events into the configured layer
:
this.$gtm.pushEvent({ event: 'myEvent', ...someAttributes })