google-tag-manager - 针对 dom 元素的 Google 跟踪代码管理器事件跟踪

标签 google-tag-manager google-datalayer

使用 Google 跟踪代码管理器自动事件跟踪 (dataLayer.push),我想跟踪此信息:

  1. 在我的菜单中点击的链接名称,例如:

    <ul class="my-nav"> <li> <a href="http://www.anothersite.com" target="_blank" rel="external">Anoter site</a> </li> </ul>

所以:'另一个站点'

  1. 我想推送具有此结构的点击链接的父链接名称名称:

<li>Linkname <ul> <li> <a href="http://www.website.com" target="_blank" rel="external">Website name</a><br/> <li> <ul> <li>

那里:我想要'Linkname'

  1. 切换链接的“状态”——元素是否具有“打开”类

    <a class="content-toggler open" href="#">Hide all the content</a>

我已经阅读了许多教程和演练,但大多数都在谈论跟踪一般转到外部站点的链接,或提交事件等。 在这里,我想跟踪某个 dom 树中链接的名称。 我想跟踪某个类的元素“状态”。

请解释这是如何实现的,或者让我引用有示例的文章 这种事件,不仅要一般演练。

非常非常感谢!

最佳答案

让我们从最后一个开始。 1) 创建链接点击监听器(新标记-->标记类型-->链接点击监听器)并在所有页面(或仅相关页面)上运行它所要做的。这将为您在规则中使用的 GoogleTagManager 生成一个事件。

2) 创建如下规则。这将触发我们将在下一阶段进行的事件

Content toggler rule

3) 设置如下事件。请注意,我添加了一个元素 ID。如果您有多个切换打开链接,您需要找到一种方法来在谷歌分析中区分它们。 ID 可以帮助你。另请注意,使用 gtm 您只能使用这些类,而不能使用一个特定的类。 (据我所知)

The event click

现在让我们回到第一个。您可以使用上面使用的相同方法,但不是将 {{element classes} 作为事件的值,您可以创建一个将使用该链接的内部文本 (gtm.element.innertext) 的新宏。关于如何操作,请阅读此处:http://www.swellpath.com/2013/10/google-tag-manager-inspecting-andconfiguring-auto-event-tracking/

对于第二个,您需要三级父级的内部文本。除了使用将通过数据层调用事件的 javascript 之外,我不确定如何实现它。

所以我建议如下解决方案:

  1. 在 GTM 上创建一个事件,用于监听通过数据层推送的事件。 有关如何执行此操作,请转到此帖子:http://moz.com/ugc/tracking-google-analytics-events-with-google-tag-manager 从“使用 GTM 跟踪 Google Analytics(分析)事件:第二种方式”开始并执行步骤:1、2 和 3。

  2. 创建点击链接时执行的 javascript 代码。每当单击该链接时,此 JS 将采用该第三个父元素的文本。同样,我建议提供 ID,这样任务会更容易。

然后,同样的 JS 代码应该运行这段代码

dataLayer.push({ 'event':'GAevent', 'eventCategory':'Navigation Clicks', 'eventAction':'Menu Item Click', 'eventLabel':'Outbound Click', 'eventValue:***YOUR 3RD LEVEL PARENT TEXT HERE***});

然后通过谷歌分析注册具有该值的事件。

请注意,我在回复中为事件值提供的所有名称都是基于我对您的需求的理解。您需要将它们调整为您希望通过此事件跟踪实现的目标。

关于google-tag-manager - 针对 dom 元素的 Google 跟踪代码管理器事件跟踪,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22939792/

相关文章:

google-analytics - GTM - 用于多个容器的一个数据层

google-analytics - 使用跟踪代码管理器未显示在 Analytics 中的增强型电子商务数据

javascript - 使用自定义 JavaScript 宏以 GTM 数据层格式格式化电子商务交易数据

google-analytics - Google跟踪代码管理器dataLayer变量未定义

javascript - GTM自定义JS触发器

javascript - 在 Google 标签管理器和 Google Analytics 中捕获 Hotjar 用户 ID

javascript - Google 标签管理器获取 h2 innertext

google-analytics - 避免 AdBlockers 阻止 Google Tag Manager

android - 事件未显示在 firebase 上

javascript - 如何使用JS抓取页面并将变量推送到GTM数据层