1.2.1 Google Analytics布署的几种方法

这一节主要介绍如何部署GA跟踪代码和如何对跟踪代码做个性化的定制,提高数据准确度以及检验代码是否部署正确。

1.部署方法1——直接部署方法

直接部署就是将跟踪代码直接部署到到站点的所有页面,根据最新的官方部署方式,现在是推荐跟踪代码部署在页面代码的header里面,也可以将跟踪代码以js的文件引入,但位置一定要在header里面,主要是为了更快加载到跟踪代码,确保数据准确度,以往的加载在footer,存在页面还在加载用户就离开了,跟踪代码没加载到的情况。

(1)获取跟踪代码

在GA里选择“管理”→“跟踪信息”→“跟踪代码”,可以看到如图1-13的页面,方框标记的就是GA的跟踪代码,就是需要复制的代码。

1.2.1 Google Analytics布署的几种方法_第1张图片

图1-13 跟踪代码的获取

注意:Google分析在2017年9月发布了全局版跟踪代码的测试版,本书仍是以讲解统一版为主,下面是统一版的跟踪代码,只需将其中的UA-XXXXX-Y替换成自己的跟踪ID即可。

代码清单1-1

(2)然后找到站点中header位置,将代码添加上去

对于网站的页面来说,通常都是有模板生成的,也即是页面会引入特定的组件,如果站点的页面只有一个模板,那只需要将代码添加在该模板的header里面就可以,如果网站比较大型,二级目录存在不同的模板,那就需要加同一个跟踪代码添加到不同的模板的header里面,确保所有的页面都要加载到。

下面是一个例子,通过查看页可以知道站点只有一个模板,那么就找到模板页面的header,如图1-14所示。

1.2.1 Google Analytics布署的几种方法_第2张图片

图1-14 代码部署

代码就添加到该位置,这样就部署完成了。

注意

如果您自己没有代码或服务器权限,需要开发帮助您添加跟踪代码,不要讲跟踪代码通过QQ直接发送给开发,这样会导致跟踪代码的编码格式改变,跟踪代码失效,可以通过将跟踪代码保存成TXT的形式再发送给开发。

2.部署方法2——GTM自定义HTML

这一节讲解如何通过GTM来部署GA跟踪代代码,这里默认大家已经都有一定的GTM基础了,主要是为了讲解GA的部署,不懂的读者可以看后面的第3章,GTM不是这一节的重点。

通过GTM有两种部署GA跟踪代码的方式,本节主要是讲解通过自定义html的形式,原理的话就是将跟踪代码添加到GTM的自定义HTML代码里面,然后触发页面是“All Pages”,这样就实现了将跟踪代码部署到所有的页面上了。

(1)获取跟踪代码

在GA里选择“管理”→“跟踪信息”→“跟踪代码”,可以看到如图1-12的页面,方框标记的就是GA的跟踪代码,就是需要复制的代码。

(2)GTM新建自定义HTML

在GTM选择“代码”→“新建”→“选择一个代码类型以开始设置…”→“自定义HTML”,命名为“GA默认跟踪代码”,然后将跟踪代码复制进入,如图1-15所示。

1.2.1 Google Analytics布署的几种方法_第3张图片

图1-15 新建自定义HTML

然后触发器选“All Pages”,最终的配置如图1-16所示。

1.2.1 Google Analytics布署的几种方法_第4张图片

图1-16 最终配置

配置好以后,如果要生效,还需要将这个配置发布到线上去,发布的方式是单击右上角的“提交”即可,这样GA跟踪代码才正式生效。

3.部署方法3——GTM内置模块

这一节主要介绍如何通过GTM里面的内置模板去部署GA跟踪代码,这个也是我最推荐的一种部署方式,与前两种方式不同的是:这一种部署方式不需要复制GA跟踪代码,是需要知道跟踪ID。原理的话是通过GTM里面的内置模板做些配置就可以了。

(1)获取跟踪 ID

在GA里选择“管理”→“跟踪信息”→“跟踪代码”,如图1-17所示,在跟踪代码页面里面找到跟踪ID,就是标记框里面:

1.2.1 Google Analytics布署的几种方法_第5张图片

图1-17 获取跟踪ID

(2)GTM中新建Universal Analytics

在GTM中选择“管理”→“跟踪信息”→“跟踪代码”→“Universal Analytics”,命名为“GA默认跟踪代码”,跟踪类型选择“页面浏览”,勾选“在此代码中启用替代设置”,然后将跟踪 ID填入标记框中,如图1-18所示。

1.2.1 Google Analytics布署的几种方法_第6张图片

图1-18 填入跟踪ID

这里的触发器也是“All Pages”,最终的配置如图1-19所示。

1.2.1 Google Analytics布署的几种方法_第7张图片

图1-19 完整配置

这里之所以推荐用这种方法做默认跟踪代码的部署,是因为通过模板来部署,做个性化的配置很简单的,可以看图1-18所示,里面有“更多设置”和“高级设置”,这些就是做个性化配置、优化、跨站、跨域跟踪设置的地方了,具体的设置下一节再详细介绍。

注意

为了不让竞争对手知道您对跟踪代码做了哪些深度定制,可以将跟踪代码保存为js文件后,在header中引入,这样做在页面不会出现相关跟踪代码源码,或可以通过GTM托管,但第三方插件还是可以检测出来的,如Ghosty和WASP.inspector,第6章将会讲解如何通过这些工具来分析竞争对手的一些信息。

你可能感兴趣的:(1.2.1 Google Analytics布署的几种方法)