Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
2.0k views
in Technique[技术] by (71.8m points)

vue.js - Can anyone help implementing Nuxt.js Google Tag Manager?

Hey i've built a Nuxt app and am having trouble with the package @nuxtjs/google-tag-manager package. Found below. The documentation is pretty light and I haven't found many example implementations out there. In my nuxt.config.js I have the following set.

['@nuxtjs/google-tag-manager', {
  id: process.env.GTM_ID,
  layer: 'dataLayer',
  pageTracking: true
}],

..but unfortunately am not getting any Page Views in Google Tag Manager

Does anyone have any ideas or experience in how to best implement GTM or what has worked for them?

Thanks in advance

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

I had a look at the package, inside modules/packages/google-tag-manager/plugin.js there is this piece of code:

window['<%= options.layer %>'].push(to.gtm || { event: 'nuxtRoute', pageType: 'PageView', pageUrl: to.fullPath, routeName: to.name })

From that, it looks like the datalayer looks like this:

{
event: 'nuxtRoute',
pageType: 'PageView',
pageURL: to.fullPath,
routeName: to.name
}

Thus in GTM, you'll get to define a custom event trigger to trigger on the "nuxtRoute' event. Like so: enter image description here

Then you want to create two DataLayer variables in GTM that will capture pageURL and possibly routeName, I say routeName is optional depends on if you're changing/updating the of the document or not. enter image description here

Then create your Google Analytics tag in GTM. Make sure it is the "pageview" type, then check the "enable overriding settings in this tag" checkbox, under "more settings > fields to set" type in "page" for fieldname and for "value" reference that variable we created. If you want to set the page title using the to.name variable just use the "title" field. Make sure you add the nuxt route trigger as well under "triggering". enter image description here

Save and publish everything or run it in preview mode and you should see the pageviews some through.


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...