谷歌分析事件追踪

谷歌分析(GA)事件追踪

Google Analytics Event Tracking

您可以添加GA事件跟踪到带有Impreza主题任何元素。在大多数时候,你只需要在发送时间信息的片段,添加additional class元素,并添加一个简单的JS的代码。

本指南不包括为您的网站基本的谷歌Analytics(分析)设置。如果您需要基本的设置信息,请访问这个页面。另外,如果你是GA活动时间新手,推荐阅读阅读本指南

以下是主题元素跟踪应用的3个实例:

按钮:自定义CSS类的例子

你可以在一个页面上有很多按钮,你可能需要添加一些追踪事件的按钮。这就是为什么一个附加到特定按钮的事件是非常重要的。幸运的是大多数的主题元素在他们设置的额外类名称(Extra class name)的字段,所以你可以用它区分需要的元素。

因此,第一步,创建一个新的按钮,设置想要的网址,标签Label和其他参数,可以再加入独特的额外的类“Extra class name”字段:

1590.png

然后添加 RAW JS元素在它下面,并添加如下代码:

<script type="text/javascript"> 
jQuery(document).ready(function(){
  jQuery('.ga-sample-btn').on('click', function() {
    ga('send', 'event', 'Buttons', 'click', 'Sample Button');
  });
});
</script>

这些元素看起来像这样:

1599.png

现在,如果你保存的页面,点击按钮,它会发出GA事件与

名为“Buttons”类别(class),

名为“Click”动作(action),

名为“Sample Button”的标签(label)。

联系方式:用于内部部件的例子

让我们尝试一些更复杂的:我们将发送GA事件不是针对整个元素,但其组件。

同以前的例子,首先创建一个新的联系人元素。填写,并添加独特的一类,因为有时你可能有这样几个要素:

1591.png

正如你可能会注意到,我们已经加入链接,电话,所以当被点击它,手机应用程序可以打开。现在保存的页面并查看浏览器的新选项卡中的结果。然后用网页检查你可能会发现可用于JS的onClick事件连接内部组件的类:

1597.png

然后添加 RAW JS元素在它下面,并添加如下代码:

<script type="text/javascript"> 
jQuery(document).ready(function(){
  jQuery('.ga-sample-contacts .w-contacts-item.for_email a').on('click', function() {
    ga('send', 'event', 'Contacts', 'click', 'Email');
  });
  jQuery('.ga-sample-contacts .w-contacts-item.for_phone a').on('click', function() {
    ga('send', 'event', 'Contacts', 'click', 'Phone');
  });
});
</script>

正如你所见,我们2个GA事件发送添加代码 – 一个用于电子邮件,一个用于手机。我们使用独特的课堂上,我们增加了,那么类所需要的组件,然后的一个标签名称,因为这两个电话和电子邮件与代表的联系的。

联系表单:表格提交的例子

在这个例子中,我们要证明你可以将GA事件,发送不仅要一个简单的点击,但几乎所有的JS事件发生在页面上。有时候,这是好事,知道有多少次您的联系方式提交(这甚至包括情况下,它被提交但由于验证错误发送时),并获得比较实际的电子邮件数量。

在这个例子中,我们不会一个独特的类添加到形式,因为通常在页面上只有一个联系表元素。但是,如果你需要,你可以自定义类添加到您的形式,并用它你的JS代码。

所以,首先添加的形式,填写,保存和更新页面。然后在新的浏览器选项卡中查看该页面,并使用Web检查发现窗体类。

1596.png

我们将使用类形式的容器,“.w-form.for_cform”。如上,添加 RAW JS元素在它下面,并添加如下代码:

<script type="text/javascript"> 
jQuery(document).ready(function(){
  jQuery('.w-form.for_cform form').on('submit', function() {
    ga('send', 'event', 'Contact Forms', 'send', 'Sample Form');
  });
});
</script>

现在,每次当用户点击表单按钮,它会发送

“contact from”类别的GA事件,

“Send”的行动,和

“Sample Form”的标签。