欢迎访问我的博客,有问题可以在任意文章底部留言评论

GTM+Consent Mode+Cookiebot:完整的Cookie Banner部署流程

Consent Management Platform Haran 3年前 (2023-03-01) 14107次浏览 16个评论
文章目录[隐藏]

更新时间:2025年12月22号

本节介绍如何通过 Google Tag Manager(GTM) 的 Consent Mode(意见征求模式) 为网站部署 CMP / Cookie Banner。如果你对 Consent Mode 不熟悉,建议先阅读:Google Tag Manager里的Consent Mode v2意见征求模式

什么是 Consent Mode

Consent Mode 本质上是一种机制,而不是一个 CMP。

当 CMP(Consent Management Platform,同意管理平台)接入 Consent Mode 后:

  • CMP 负责 收集用户的授权状态
  • 授权信息会被 传递给 Consent Mode
  • Consent Mode 会将其 转化为标准化的意见征求参数
  • 这些参数可以 直接被 Google 产品(如 GA4、Google Ads)以及 GTM 中的第三方标签使用

这样可以在合规前提下控制数据收集与建模行为。

 

原理说明

用户访问网站时,整体流程如下:

  1. 用户打开网站
  2. GTM 最先加载 CMP(Cookiebot
  3. CMP 弹出 Cookie Banner,向用户进行告知并请求授权
  4. 用户的授权结果传递给 Consent Mode
  5. Consent Mode 将授权状态转换为意见征求参数
  6. GA4 及 GTM 中的第三方追踪代码根据授权状态决定是否执行

配置步骤(以 GA4 + Cookiebot 为例)

以GA4里为,看如何设置Cookiebot

step 1 : 获取Cookiebot ID

Cookiebot创建一个账号,获取Cookiebot ID,我这里获得的Cookiebot ID是:1d1f0b31-6f9b-4ff1-82b9-9950d83fb3b4。

 

step 2 : GTM配置Cookiebot代码

GTM社区模板搜索“Cookiebot”上有模板,安装后做如下配置:

GTM+Consent Mode+Cookiebot:完整的Cookie Banner部署流程

配置很简单:

 

 

step 3 : GTM上设置用户意见征求(Consent Mode)

接下来就是在GTM上启用Consent Mode,在GTM上点击「管理」——「容器设置」,在其他设置里勾选:

GTM+Consent Mode+Cookiebot:完整的Cookie Banner部署流程

保存后,返回到代码,可以这里有个「用户意见征求概览」的Icon:

GTM+Consent Mode+Cookiebot:完整的Cookie Banner部署流程

全部将其设置为「无需更更多用户意见征求」。

这里有三个选项

GTM+Consent Mode+Cookiebot:完整的Cookie Banner部署流程

 

 

  • 未设置:默认是这个,此代码不会执行更多用户意见征求。
  • 不需要额外的用户同意:代码会需检查现有用户意见征求意见,也就是内置用户意见征求检查里已经设置意见征求模式参数
  • 需要额外的用户同意才能触发代码:还需要更多的意见征求模式参数才可以

一般情况下,选择「无需更更多用户意见征求」就可以。

 

如果内置用户意见征求检查没有如预期生效,可以改为“需要额外的用户同意才能触发代码”,如:GTM+Consent Mode+Cookiebot:完整的Cookie Banner部署流程

 

step 4 : 调整代码逻辑

用户访问第一个页面的时候会弹出Cookie Banner,用户同意过后,会发送一个事件,我们需要通过这个事件去触发页面,才能跟踪到第一个页面的数据。、

GTM中点击「触发器」—「新建」—「选择一个触发器类型以开始设置」——「自定义事件」,命名为“cookie_consent_update”,做如下设置:

GTM+Consent Mode+Cookiebot:完整的Cookie Banner部署流程

 

接下就是将这个触发器替换GA4的页面浏览:

GTM+Consent Mode+Cookiebot:完整的Cookie Banner部署流程

 

 

step 5 : 调试

最后就是预览调试:

GTM+Consent Mode+Cookiebot:完整的Cookie Banner部署流程

 

先清除Cookie,然后在预览调试,会弹出Cookie Banner:

  • 如果用户拒绝,不做数据跟踪
  • 如果用户同意,就可以做数据跟踪

 

 

延伸阅读:

喜欢 (6)
发表我的评论
取消评论
表情 贴图 加粗 删除线 居中 斜体 签到

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

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
(16)个小伙伴在吐槽
  1. 求助 哪一个安装方便呢,还能给app装consent mode?我用consent manager 发现麻烦,不如博主发的这个好安装
    LLLLL2024-07-17 10:03 回复 Windows 10 | Chrome 126.0.0.0
  2. 网站中新建consent mode,GA4的用户数据大幅度减少?是不是因为用户选择了“decline”所以跟踪不到。如果希望继续跟踪decline的用户,该如何设置
    Imy2024-04-17 23:19 回复 Windows 10 | Chrome 123.0.0.0
    • Haran
      是的,拒绝后就不能跟踪,如果拒绝后继续跟踪,就不合规的了。 GA4里有个混合数据的功能,他是根据模型估算的数据,可以找回部分数据,但不完全准确。
      Haran2024-04-18 09:19 回复 Mac OS X | Chrome 123.0.0.0
  3. 看了几个cmp产品,对这些配置说的都很模糊,说是根据自身需要去做。 ad_storage: "denied", ad_user_data: "denied", ad_personalization: "denied", analytics_storage: "denied", functionality_storage: "denied", personalization_storage: "denied", security_storage: "granted", wait_for_update: 2000, 不同cmp默认配置略有不同,哪些该denied,哪些该granted,有些搞不清楚,这个有什么原则么?博主建议怎么配置
    liuqing2024-03-14 10:03 回复 Windows 10 | Chrome 122.0.0.0
  4. 请问博主,用户同意或者拒绝的结果怎么验证
    xiaohuihui2024-02-25 17:46 回复 Windows 10 | Chrome 121.0.0.0
    • Haran
      CMP产品一般会将拒绝或同意信息写到cookie,可以看对应CMP产品使用哪些cookie,以及不同值的意义
      Haran2024-02-26 10:35 回复 Mac OS X | Chrome 121.0.0.0
      • cookie中是可以看到拒绝或同意的结果,但是如果我想快速验证这个授权结果最终应用到谷歌层面是否生效的表现应该怎么去验证呢
        xiaohuihui2024-02-27 17:10 回复 Windows 10 | Chrome 122.0.0.0
        • Haran
          看发送给Google的请求,同意的时候,可以看到请求,拒绝的时候,看不到请求
          Haran2024-02-27 21:06 回复 Mac OS X | Chrome 122.0.0.0
  5. 博主,请教下,我直接在Cookiebot里面设置,然后在网站上放代码也可以吧?
    Evan2023-07-14 16:36 回复 Mac OS X | Chrome 114.0.0.0
    • Haran
      可以,但还是需要在GTM上做设置
      黄业忠2023-07-14 16:55 回复 Mac OS X | Chrome 114.0.0.0
1 2