Google Tag Manager上安装Google Analytics 4(2024)

Google Analytics 4 Haran 7年前 (2017-07-21) 24456次浏览 12个评论
文章目录[隐藏]

更新时间:2024年6月18号

写在前面:更多关于Google Analytics 4 的布署方法请看Google Analytics 4 的几种布署方法

Google Analytics 4 的原理是通过在网站添加一段JS监听、采集数据,通过虚拟1*1像素的图片作为数据载体传输会Google服务器,然后在Google Analytics 4 展现各种各种的数据报告。

假设现在有新站http://www.ichdata.com需要布署Google Analytics 4,这里采用通过Google Tag Manager布署Google Analytics 4 的方式,先需要在Google Tag Manager上操作和设置,然后在到Google Analytics 4 上做配置。

接下来看具体操作过程。

布署Google Tag Manager

创建GTM容器

访问https://marketingplatform.google.com/about/tag-manager/,在现有账户中新建一个GTM容器,点击GTM账户右侧中那三点,会出现一个下拉菜单,选择“创建容器”:

Google Tag Manager上安装Google Analytics 4(2024)

选择后会出现如下界面,在「容器名称」中输入网址或网站名字,「容器使用位置」中根据自己的实际情况选择类型,这里选择「网站」:Google Tag Manager上安装Google Analytics 4(2024)

点击「创建」后就创建完容器。

 

获取GTM跟踪代码

点击「管理」——「安装Google跟踪代码管理器」就可以看到GTM的跟踪代码,跟踪代码有两段,一段部署在head里面,一个段部署在body里面。

Google Tag Manager上安装Google Analytics 4(2024)

布署GTM跟踪代码到网站

找到模板页的头部,将上面的两段跟踪代码添加上去即可,这个没什么特别的难度,如果你没有服务器权限,就将代码复制保存成txt,让你们开发去加,切记不要复制代码后通过QQ等即时通信软件发送,这样会导致代码的编码改变,跟踪代码就不能使用。

Google Tag Manager上安装Google Analytics 4(2024)

注意:截图是footer,但实际应该要布署到header。

检验GTM是否生效

按照官方部署上后,基本都是没问题的,现在需要检验GTM代码是否生效,这里需要借助一个工具Tag Assistant,如果这工具检测到有GTM的跟踪代码,就是没问题得了。

打开Chrome中输入“chrome://extensions/”后回车,然后下拉到底部点击“获取更多插件”,搜索“Tag Assistant”,可以看到:Google Tag Manager上安装Google Analytics 4(2024)

点击“ADD TO Chrome”可以在浏览器的右上角看到一个蓝色图标。访问http://www.ichdata.com,然后点击里的enable后刷新一下页面,然后看是否有Google Tag Manager的跟踪代码:

Google Tag Manager上安装Google Analytics 4(2024)

如果有,表示GTM跟踪代码生效。

创建Google Analytics 4

Google Analytics 4 中创建媒体资源

创建媒体资源主要是设置媒体资源的基本信息,如媒体资源名称、时区、货币和行业类别

Google Analytics 4 中点击「管理」——「创建」——「媒体资源」,操作如下:

Google Tag Manager上安装Google Analytics 4(2024)

      

媒体资源创建

点击后可以看到媒体资源设置界面:

Google Tag Manager上安装Google Analytics 4(2024)

 

  • 网络媒体资源名称:自定义媒体资源的名称
  • 报告时区:设置时区
  • 币种:设置货币类型,会影响在报告中的币种显示

设置好后点击“下一步”

 

商户详细信息

然后可以看到如下界面,根据自己的实际情况填写上面的信息:   

Google Tag Manager上安装Google Analytics 4(2024)

 

这里主要设设置行业类别,公司规模和使用目的。

业务目标

业务目标这一步是设置预设报告,

Google Tag Manager上安装Google Analytics 4(2024)

数据收集

最后点击创建,这样就创建好了Google Analytics 4 的媒体资源

Google Tag Manager上安装Google Analytics 4(2024)

接下来就可以创建数据流。

 

创建数据流获取衡量ID

Google Analytics 4 中点击「管理」———「媒体资源设置」——「数据收集与修改」——「数据流」——「创建数据流」——「网站」,进入设置数据流的页面:

Google Tag Manager上安装Google Analytics 4(2024)

  •  网站网址:设置网站的网址,其实就是填写主域就行,这里填www.ichdata.com
  • 数据流名称:自定义数据流名称,一般填网站的名称,这里填GA小站
  • 增强型衡量功能:

填好后点击“创建数据流”即可,创建成功会看到网站数据流详情:

Google Tag Manager上安装Google Analytics 4(2024)

这个就是衡量ID,复制它。

Google Tag Manager上配置Google Analytics 4

接下来就是在GTM上配置GA4,并且做验证。

GTM中布署GA4跟踪代码                

在GTM中,点击「代码」——「新建」——「选择一个代码类型以开始设置」——「Google 代码」,命名为“GA4-Basic Tracking”,做如下配置:

Google Tag Manager上安装Google Analytics 4(2024)

触发器是选择All Page,然后保存,这样就完成配置了。

检验Google Analytics 4 是否生效

GTM中点击右上角的预览,进入测试状态后,在Tag Assistant里的看代码GA4-Basic Tracking是否触发,如果触发,表示GA4部署没问题。

Google Tag Manager上安装Google Analytics 4(2024)

Google Analytics 4 上的必要设置与调优

GA4布署后,我们还需要对GA4的一些设置做优化,确保数据准确,具体请看:安装Google Analytics 4 后的十大必要设置

 

验证数据正确

GA4里收集到有数据,就表示布署完成。

 


如有疑问,可以在文章底部留言或邮件(haran.huang@ichdata.com) 我~
喜欢 (22)
发表我的评论
取消评论
表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
(12)个小伙伴在吐槽
  1. 博主,您好,我用GTM部署了GA4,现在发现订单的转化价值抓不到,请问下有办法解决不,谢谢!
    Leo2022-10-18 14:40 回复 Windows 10 | Chrome 98.0.4758.82
    • Haran
      预览调试,看value是否拿到值
      黄业忠2022-10-18 15:45 回复 Mac OS X | Chrome 106.0.0.0
  2. 通过GTM一直提醒这个:您的网站未启用数据收集功能。如果 48 小时之前您就添加了代码,请确保代码设置正确无误。但是统计报表中有实时数据
    zyk2022-08-27 11:56 回复 Mac OS X | Chrome 104.0.0.0
    • Haran
      如果GTM确认已经发布出去,实时有数据,可以忽略提醒。
      黄业忠2022-08-28 10:10 回复 Mac OS X | Chrome 104.0.0.0
  3. 为什么我设置之后访问的图标是黄色的,但是我发布了
    blance2019-07-11 14:41 回复 Windows 10 | Chrome 75.0.3770.100
    • 什么图标
      GA小站2019-07-11 18:07 回复 Mac OS X | Chrome 75.0.3770.100
  4. 就是部署GTM,同时也要设置GA 是吗
    blance2019-07-11 14:01 回复 Windows 10 | Chrome 75.0.3770.100
  5. 通过GTM部署GA,和两个都部署,但GA不是由GTM部署而是分开用原生代码部署,加载速度上会有差异吗?
    迷斛2018-10-28 19:13 回复 Windows 10 | Firefox浏览器 63.0
    • 单独的更快
      GA小站2018-10-29 02:25 回复 Mac OS X | Chrome 69.0.3497.100
  6. 博主,我们只需要添加GTM代码吗?GA不用添加吗?
    Peter2018-08-07 11:34 回复 Windows 7 | Chrome 55.0.2883.87
    • 可以在GTM里面配置
      GA小站2018-08-07 13:45 回复 Mac OS X | Chrome 67.0.3396.99