谁能帮助实现Nuxt.js Google跟踪代码管理器? [英] Can anyone help implementing Nuxt.js Google Tag Manager?

问题描述

嘿，我已经构建了Nuxt应用程序，但包@nuxtjs/google-tag-manager包遇到了问题.在下面找到.该文档非常简单，我在那里找不到很多示例实现.在我的nuxt.config.js中，我进行了以下设置.

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
}],

..但很遗憾，在Google跟踪代码管理器中未获得任何页面浏览量

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

有人对如何最好地实施GTM或对他们有用的方法有任何想法或经验吗?

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

预先感谢

推荐答案

我看了看包装，在modules/packages/google-tag-manager/plugin.js里面有这段代码:

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
}

因此，在GTM中，您将定义一个自定义事件触发器以在"nuxtRoute"事件上触发.

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

然后，您要在GTM中创建两个DataLayer变量，这些变量将捕获pageURL并可能捕获routeName，我说routeName是可选的，取决于您是否要更改/更新文档的.

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.

然后在GTM中创建您的Google Analytics(分析)标签.确保它是页面浏览"类型，然后选中更多设置>要设置的字段"下的启用此标签中的替代设置"复选框，并在页面"中键入我们创建的变量的字段名和值"引用.如果要使用to.name变量设置页面标题，请使用标题"字段.确保在触发"下也添加了nuxt路由触发器.

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".

保存并发布所有内容，或以预览模式运行它，您应该会通过一些浏览量.

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

这篇关于谁能帮助实现Nuxt.js Google跟踪代码管理器?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！