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

Question

使用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>
<li> <ul> <li>

所以：我想要'Linkname'

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

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

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

请解释如何实现这一目标，或者请参阅具有示例的文章 这种事件，不仅仅是一般的演练。

非常感谢！

Answer 1

让我们从最后一个开始。 1）您需要做什么来创建链接点击监听器（新标签 - ＆gt;标签类型 - ＆gt;链接点击监听器）并在所有页面（或仅与其相关的页面）上运行它。这将为您在规则中使用的GoogleTagManager生成一个事件。

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

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

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

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

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

1. 在GTM上创建一个事件，用于侦听通过数据层推送的事件。 关于如何执行此操作，请转到以下帖子：http://moz.com/ugc/tracking-google-analytics-events-with-google-tag-manager 首先使用＆＃34;使用GTM跟踪Google Analytics事件：第二种方式＆＃34;并执行步骤：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***});

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

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