本文介绍如何将谷歌优化的代码添加到网站上,以及如何使用GA和GTM确保跟踪的效果。
入门
为了设置和使用谷歌优化,你需要以下事项:
GA账户:谷歌优化是基于GA的,没有GA账户是不行的
GTM:使用GTM可以方便地向网站中添加UA代码以及Google优化代码,而不用再去找开户部门协助,而且,GTM还支持跟踪事件。谷歌优化需要使用GA的目标作为实验对象,所以我们可以使用GTM来跟踪事件,使用GA来记录转化次数。
在过去GTM的代码段是部署在body代码开始的时候,而现在,谷歌优化的新版本发布后,GTM的代码段可以添加在head元素中。
谷歌chrome浏览器:谷歌优化需要一个chrome浏览器的插件来修改测试变量。
谷歌优化插件:该插件能够使用Optimize可视化编辑器(之前有提到过)。
设置谷歌优化
设置谷歌优化的流程如下:
创建账户以及容器
将容器关联到GA
在网站上安装谷歌优化代码
1.创建Optimize账户和容器
通常情况下,一个公司只需要创建一个账户即可;容器是你在账户创建实验以及配置设置的地方。
点击创建账户后,你需要添加账户名称以及容器名称,点击接受相关服务及条款后,创建完成,你将跳转到容器页面。
2.将容器关联到GA
将容器和GA关联起来,这样我们就可以在谷歌优化中使用GA的数据了,同样的,谷歌优化的实验数据也能被GA所跟踪到,并反馈到优化中。
在容器页面的右侧,你将看到完成设置的5个步骤:
点开“关联到GA”下拉菜单,点击关联媒体资源
在下拉列表中选择对应的媒体资源,确保选择的媒体资源跟你的实验所在域相同
选择你想要关联的视图
点击蓝色的关联按钮
在上面的步骤中,视图的选择很重要,在GA账户中的目标的数量最多是20个。而且由于谷歌优化需要GA记录的目标,因此你需要确认你目前使用的目标以及还需要使用多少目标来进行测试。如果需要的目标数量回超过20个,那么你就需要重新添加一个测试视图了。
在视图中还有一些需要注意的地方。在GA的视图中,你可以查看实验结果,但是视图的过滤器会影响实验结果的数据。比如,如果你在视图中过滤掉了内部流量,它们仍然能在实验中看到,但是其数据不会包含在结果中。
3.如何部署谷歌优化代码段
基于你在网站上部署GA或者GTM代码的方式的不同,部署谷歌优化代码的方式也会有差别。最简单的就是将代码添加到GTM中,当然也可以直接将代码添加到页面中。下面我们将给出推荐方法。
直接添加GA和Optimize代码,不使用GTM
https://support.google.com/360suite/optimize/answer/6262084
使用GTM添加GA和Optimize代码
https://support.google.com/360suite/optimize/answer/7359264
上面的两种方式都是需要将代码(我们叫做Analytics-Optimize代码段)添加到网站的每个页面上。而这些代码有可能触发实验,因此在这些代码上我们还需要添加一些其他的东西。
下面这些内容需要添加在Analytics-Optimize代码段之前:
数据层初始化(可以在Optimize和GTM中使用这些信息)
设置cookies
想在Optimize实验中使用的JS或者声明的变量
页面隐藏代码
下面这些内容需要添加在Analytics-Optimize代码段之后:
其他跟踪器、GA代码、广告代码或者GTM代码
不需要定位到实验的其他脚本。
关于页面隐藏脚本
使用页面隐藏脚本并不是必须的,但是最好要加上,因为这可以防止页面出现闪烁。当用户进入页面,而变量在显示之前,用户看到原始页面闪烁,变成你修改后的结果。这种闪烁可能会对用户的体验和实验结果造成影响。
该代码需要添加到尽可能靠前的位置。比如在之后,Optimize、GA、GTM代码之前。
页面隐藏代码超时功能:如果时间过长,页面隐藏代码超时功能会阻止Optimize继续加载实验。默认时间是4秒,这个时间可以修改,但是需要知道改变这个时间会影响实验中多少用户。
关于Analytics-Optimize代码段
首先我们需要知道代码段中包含哪些内容,下面各部分的运行顺序。
页面开始加载
页面隐藏代码加载
GA加载页面上的JS代码
Optimize加载页面上的JS代码,实验可能会被触发
GTM加载页面上的代码
GA的页面浏览代码被触发
加载页面的其他内容
在上面的Analytics-Optimize代码段中包含两条命令:
ga(‘create’, ‘UA-123456-1’, ‘auto’);-加载GA跟踪器,我们也可以将auto设置为域名,同GA代码的用法
ga(‘require’, ‘GTM-XXXXXX’);-加载Optimize的容器
关于GTM代码
现在GTM代码的部署是分为两部分进行的,一部分部署在head中,一部分部署在body中。具体方法在获取GTM代码时有详细说明。
检查
在代码部署的时候,在一个GA媒体资源中,你一次只能发送一个页面浏览,不能重复设置send来重复发送,例如:
页面上:含ga(‘send’,’pageview’)
GTM中:不含GA的页面浏览代码
或者
页面上:不含ga(‘send’,’pageview’)
GTM中:含GA的页面浏览代码