谷歌GA4 埋点教程和使用指南

好的,这是一份关于 GA4 埋点教程和使用指南的基础内容,希望能帮助你补充你的培训教程:

1.GA4 是什么

GA4 (Google Analytics 4) 是 Google 推出的新一代网站和应用分析工具,旨在提供更全面、更智能的衡量和分析能力。相较于之前的版本(Universal Analytics),GA4 的核心区别在于:

  • 基于事件的数据模型:GA4 不再以会话(Sessions)为主要衡量指标,而是以用户与网站或应用的各种交互(事件)为核心。这使得数据收集更加灵活,能够更精细地追踪用户行为。
  • 跨平台追踪能力:GA4 可以统一衡量网站和应用的数据,方便你了解用户的完整旅程。
  • AI 和机器学习驱动:GA4 内置了强大的机器学习模型,可以提供预测性洞察,例如潜在的流失用户、预测的收入等。
  • 更强大的用户身份识别:GA4 可以通过用户 ID、Google 信号和设备 ID 等多种方式识别用户,提升跨设备追踪的准确性。
  • 注重隐私保护:GA4 在设计上更加注重用户隐私保护,符合最新的隐私法规。

简单来说,GA4 是一个强大的工具,可以帮助你深入了解用户在你的网站或应用上的行为,从而优化你的产品、内容和营销策略。

2.GA4 事件是什么

GA4 的核心是“事件(Events)”。事件是指用户在你的网站或应用上发生的各种交互行为。这些行为可以是:

  • 页面浏览(page_view):用户加载或查看了一个页面。
  • 点击(click):用户点击了网站上的某个链接、按钮或其他元素。
  • 滚动(scroll):用户滚动到页面的底部附近。
  • 文件下载(file_download):用户下载了一个文件。
  • 视频播放(video_start, video_progress, video_complete):用户开始、观看一定进度或完成播放视频。
  • 表单提交(form_submit):用户提交了一个表单。
  • 加入购物车(add_to_cart):用户将商品添加到购物车。
  • 开始结账(begin_checkout):用户开始结账流程。
  • 购买(purchase):用户完成了购买。

每个事件都可能包含相关的“参数(Parameters)”,用于提供关于该事件的更多信息。例如,对于“购买(purchase)”事件,参数可能包括商品 ID、商品名称、购买数量、交易金额、货币等。

3.GA4 埋点是什么

GA4 埋点(Tracking Code Implementation)指的是在你的网站或应用中部署特定的代码,以便将用户的各种交互行为(即事件)记录下来并发送给 Google Analytics 4 进行分析。

埋点的目的就是告诉 GA4 你的用户在做什么,以及他们是如何与你的网站或应用互动的。

常见的埋点方式包括:

  • 自动收集事件:GA4 会自动收集一些基本的事件,例如页面浏览、首次访问、会话开始等,无需你手动配置。
  • 增强型衡量事件:你可以在 GA4 后台启用增强型衡量功能,自动追踪更多用户交互,例如站内搜索、出站点击、文件下载、视频互动等。
  • 手动埋点(自定义事件):对于 GA4 无法自动追踪的特定用户行为,你需要手动编写代码来发送自定义事件。例如,追踪用户点击了某个特定的推广横幅、填写了某个特定的调查问卷等。

4.GTM 是什么

GTM (Google Tag Manager) 是 Google 提供的一个免费的标签管理系统。它可以帮助你轻松地在网站或移动应用中部署和管理各种营销和分析标签(例如 GA4 代码、Google Ads 转化跟踪代码、Facebook Pixel 等),而无需直接修改网站或应用的源代码。

你可以将 GTM 看作是一个中央控制面板,用于管理你网站上的各种跟踪代码。

使用 GTM 的主要好处包括:

  • 简化标签管理:无需每次都修改代码,通过 GTM 界面即可添加、编辑和删除标签。
  • 提高网站加载速度:GTM 可以异步加载标签,减少对网站性能的影响。
  • 降低出错风险:通过用户友好的界面进行操作,减少了手动修改代码可能引入的错误。
  • 方便团队协作:允许多个团队成员在同一个 GTM 容器中进行协作,而无需直接访问网站代码。
  • 内置版本控制:GTM 会记录每次更改,方便你回溯到之前的版本。

5.ADS 目标和 GA4 事件的关系

ADS (Google Ads) 是 Google 的在线广告平台。在 Google Ads 中,你可以设置广告系列的目标(例如提高网站流量、获取潜在客户、增加销量等)。为了衡量广告系列的效果,你需要跟踪用户在点击你的广告后在网站上发生的关键行为,这些关键行为通常与 GA4 事件相关联。

简单来说,GA4 事件可以作为 Google Ads 转化跟踪的目标。

当你将 GA4 与 Google Ads 关联后,你可以将在 GA4 中收集到的特定事件标记为 Google Ads 的转化目标。例如:

  • 在 GA4 中追踪“购买(purchase)”事件,并在 Google Ads 中将其设置为“购买”转化目标。这样,你就可以知道有多少用户在点击你的广告后完成了购买。
  • 在 GA4 中追踪“表单提交(form_submit)”事件,并在 Google Ads 中将其设置为“潜在客户”转化目标。这样,你就可以知道有多少用户在点击你的广告后提交了询价表单。

通过将 GA4 事件与 Google Ads 目标关联起来,你可以更清晰地了解你的广告投放对网站关键行为的影响,从而优化你的广告策略并提高广告 ROI。

6.事件埋点的集中方式

事件埋点的集中方式主要指的是如何统一管理和部署你的埋点代码,以便更好地维护和管理。以下是一些常见的集中方式:

Google Tag Manager (GTM):这是最推荐和最常用的集中埋点方式。你只需要在网站或应用中部署一次 GTM 的容器代码,之后所有的 GA4 代码(包括基础代码和各种事件跟踪代码)都可以在 GTM 的界面上进行配置和管理。

  • 优点:无需修改代码,部署灵活,版本控制,方便协作。
  • 缺点:需要学习 GTM 的使用。

数据层 (Data Layer):结合 GTM 使用,数据层是一个存储临时信息的 JavaScript 对象,用于在你的网站或应用代码和 GTM 之间传递数据。你可以将需要跟踪的事件信息推送到数据层,然后在 GTM 中配置相应的触发器和标签来捕获这些信息并发送给 GA4。

  • 优点:代码更清晰,逻辑更解耦,方便管理复杂的埋点逻辑。
  • 缺点:需要一定的开发知识来设置数据层。

代码统一管理:如果不使用 GTM,你可以将所有的 GA4 埋点代码放在一个或几个集中的 JavaScript 文件中进行管理。

  • 优点:对于小型网站或简单的埋点需求可能足够。
  • 缺点:修改和维护不方便,容易出错,需要直接修改代码。

使用 CMS 插件或扩展:许多内容管理系统(CMS)如 WordPress、Shopify 等都有相关的插件或扩展,可以帮助你简化 GA4 的部署和事件跟踪。

  • 优点:无需编写代码,操作简单。
  • 缺点:功能可能有限,不够灵活。

推荐使用 Google Tag Manager 配合数据层的方式进行 GA4 事件埋点的集中管理,这样可以最大程度地提高效率、降低维护成本并减少错误。

7.自定义事件上报

对于 GA4 自动收集和增强型衡量无法覆盖的特定用户行为,你需要进行自定义事件上报。这通常涉及到手动编写代码来发送事件数据给 GA4。

1、google代码自定义上报

自定义事件上报的步骤通常如下:

  1. 确定需要追踪的用户行为:例如,用户点击了某个特定的按钮、观看了某个特定的视频、填写了某个特定的表单等。
  2. 确定需要发送的事件名称:自定义事件名称需要遵循一定的规范,通常建议使用小写字母和下划线。尽量使用具有描述性的名称,例如 promotion_banner_click,video_watched_30s,survey_submitted。
  3. 确定需要发送的事件参数:除了事件名称,你还可以发送额外的参数来提供关于该事件的更多信息。例如,对于 promotion_banner_click 事件,你可以发送 banner_id 和 promotion_name 等参数。
  4. 编写代码进行事件上报:你可以使用 GA4 的 JavaScript API(gtag())来发送自定义事件。例如:
  5. JavaScript
// 当用户点击某个推广横幅时
document.getElementById('my-banner').addEventListener('click', function() {
  gtag('event', 'banner_click', {banner_id: 'banner123', promotion_name: 'summer_sale', link_url: '/summer-sale'});
});
// 当用户观看视频达到 30 秒时
function onVideoProgress(videoId, currentTime) {
  if (currentTime >= 30) {
    gtag('event', 'video_watched_30s', {video_id: videoId, video_title: '产品介绍视频'});
  }
}

2、Google Tag Manager (GTM)

当 GA4 的自动收集和增强型衡量功能无法满足你的特定跟踪需求时,就需要使用自定义事件上报。Google Tag Manager (GTM) 是实现自定义事件上报的强大工具,它允许你通过界面配置,而无需直接修改网站代码。

使用 GTM 上报自定义事件通常涉及以下几个核心概念:

  • 触发器(Triggers):用于监听你网站上发生的特定用户行为或满足特定条件。当触发器被激活时,会触发与之关联的标签。
  • 标签(Tags):是一段代码或配置,用于向特定的分析平台(例如 GA4)发送数据。对于自定义事件上报,你需要使用 GA4 事件标签。
  • 变量(Variables):用于捕获网站上的动态数据,例如用户的点击文本、链接 URL、表单提交的值等,这些数据可以作为事件参数发送给 GA4。

下面我们通过具体的场景来讲解如何使用 GTM 上报自定义事件:

一、追踪用户点击特定按钮

假设你想追踪用户点击你网站首页上一个特定的按钮的行为。

  1. 确定触发器:

你需要创建一个触发器,当用户点击按钮时激活。在 GTM 中,你可以选择以下类型的触发器:

  • 点击 – 所有元素 (Click – All Elements):监听所有可点击的元素。你需要通过额外的条件来限定只监听你的推广横幅。
  • 点击 – 仅链接 (Click – Just Links):监听所有 <a> 标签的点击。如果你的横幅是一个链接,可以使用这个触发器。
  • 元素可见性 (Element Visibility):如果你想在用户看到按钮时触发事件,可以使用这个触发器。但对于点击事件,点击触发器更合适。

我们选择 点击 – 所有元素 触发器,并设置以下条件来限定只监听我们的按钮(假设你的按钮有一个唯一的 ID):

  • 触发此触发器的事件:点击 – 所有元素
  • 此触发器在以下情况下激活:
  • 选择事件发生时满足所有以下条件(And)
    • 元素 文本 等于 contains with google

2.创建 GA4 事件标签:

接下来,你需要创建一个 GA4 事件标签,当上面的触发器被激活时发送自定义事件到你的 GA4 媒体资源。

  • 标签类型:Google Analytics: GA4 事件
  • 配置代码:选择你的 GA4 配置代码标签(如果你还没有,需要先创建一个 GA4 配置代码标签)。
  • 事件名称:输入你的自定义事件名称,例如 Continue with Google 。

3.配置标签的触发:

在标签配置页面的“触发”部分,选择你在第一步创建的触发器。

4.预览和发布:

在 GTM 中点击“预览”按钮,然后在你的网站上进行测试,确保当你点击按钮时,GA4 能够正确接收到事件。确认无误后,点击“提交”并发布你的 GTM 容器。

二、追踪用户填写并提交特定的联系表单

假设你想追踪用户成功填写并提交了网站上的一个联系表单。

5.确定触发器:

你需要创建一个触发器,当用户成功提交该联系表单时激活。常见的触发器类型包括:

  • 表单提交 (Form Submission):监听表单的提交行为。你可以通过额外的条件来限定只监听你的特定联系表单。
  • 自定义事件 (Custom Event):如果你的表单提交成功后会触发一个特定的 JavaScript 事件(通常由开发人员设置),你可以监听这个自定义事件。

我们选择 表单提交 触发器,并设置以下条件来限定只监听我们的联系表单(假设你的联系表单有一个唯一的 ID contact-form):

  • 触发此触发器的事件:表单提交
  • 此触发器在以下情况下激活:
  • 选择事件发生时满足所有以下条件(And)
    • 表单 ID 等于 contact-form
  • 你也可以使用其他条件,例如表单的 CSS 选择器。

6.创建 GA4 事件标签:

创建一个 GA4 事件标签,当表单提交触发器被激活时发送自定义事件。

  • 标签类型:Google Analytics: GA4 事件
  • 配置代码:选择你的 GA4 配置代码标签。
  • 事件名称:输入你的自定义事件名称,例如 contact_form_submitted。
  • 事件参数:你可以添加事件参数来提供更多信息,例如:
  • 参数名称:form_id,值:contact-form
  • 参数名称:submission_url,值:{{Page URL}}(使用内置变量获取当前页面 URL)
  • 参数名称:(如果你想获取用户填写的特定字段的值,例如姓名或邮箱,需要配置用户定义的变量来捕获这些数据层信息或表单元素属性)

7.配置标签的触发:

选择你在第一步创建的“联系表单提交”触发器。

8.预览和发布:

同样地,进行预览和测试,确保表单成功提交后,GA4 能够接收到 contact_form_submitted 事件。确认无误后发布你的 GTM 容器。

三、更多触发器类型和应用场景:

  • 计时器 (Timer):可以在指定的时间间隔后触发事件,例如追踪用户在页面上停留的时间。
  • YouTube 视频 (YouTube Video):追踪用户与嵌入的 YouTube 视频的互动,例如开始播放、暂停、观看进度等。
  • 滚动深度 (Scroll Depth):在用户滚动到页面特定百分比时触发事件,用于衡量内容参与度。
  • 自定义事件 (Custom Event):监听网站代码中通过 dataLayer.push() 推送的自定义事件。这需要开发人员在网站代码中预先埋入相应的事件推送代码。
  • 使用数据层 (Data Layer) 进行更精细的自定义事件上报:
  • 前提还要插入容器代码:

对于更复杂的场景,或者你想发送更丰富的事件参数,推荐使用数据层配合 GTM 进行自定义事件上报。

  1. 开发人员在网站代码中推送数据到数据层:当特定事件发生时,开发人员会编写 JavaScript 代码,将相关信息以 JavaScript 对象的形式推送到 GTM 的数据层。例如,当用户成功购买商品时:
  2. JavaScript
dataLayer.push({
  'event': 'purchase',
  'transactionId': 'T12345',
  'transactionTotal': 199.99,
  'currency': 'USD',
  'itemDetails': [
    {
      'itemId': 'SKU123',
      'itemName': '产品 A',
      'itemPrice': 99.99,
      'quantity': 1
    },
    {
      'itemId': 'SKU456',
      'itemName': '产品 B',
      'itemPrice': 100.00,
      'quantity': 1
    }
  ]
});

比如之前添加过的shopmate的注册事件:register

  1. 在 GTM 中创建自定义事件触发器:
  • 触发器类型:自定义事件
  • 事件名称:输入你在数据层中 event 键对应的值,例如 。
  1. 在 GTM 中创建用户定义的变量:
  2. 你需要为数据层中的每个需要使用的信息创建相应的用户定义的变量。
  1. 创建 GA4 事件标签:
  • 标签类型:Google Analytics: GA4 事件
  • 配置代码:选择你的 GA4 配置代码标签。
  • 事件名称:可以直接使用数据层中的 event 值,使用变量 {{event}}。
  • 事件参数:将你在数据层中获取到的变量作为事件参数的值。例如:
  1. 配置标签的触发:
  2. 选择你在第二步创建的“购买”自定义事件触发器。
window.dataLayer.push({
'event': 'register',
'user_id': 'xxx'
});
  1. 预览和发布:
  2. 进行预览和测试,确保当网站代码推送 register 事件到数据层时,GA4 能够正确接收到包含详细交易信息的自定义事件。

8.埋点数据如何查看

你可以在 Google Analytics 4 的报告中查看你埋点收集到的数据。常用的查看方式包括:

  • 实时报告 (Realtime):可以实时查看当前网站或应用上的用户活动,包括事件触发情况。你可以在“报告”->“实时”中查看
  • 事件报告 (Events):可以查看所有已收集到的事件的汇总数据,包括事件计数、事件数量等。你可以在“报告”->“互动”->“事件”中查看。
  • 转化报告 (Conversions):如果你将某些 GA4 事件标记为转化,可以在转化报告中查看这些转化事件的数据。你可以在“报告”->“互动”->“转化”中查看。
  • 探索报告 (Explore):“探索”功能提供了更灵活的数据分析方式,你可以创建自定义的报告,例如自由形式报告、漏斗报告、路径探索等,以便更深入地分析你的埋点数据。

在查看埋点数据时,你需要注意以下几点:

  • 数据延迟:GA4 的数据通常会有一定的处理延迟,实时报告是近乎实时的,但其他报告可能会有数小时的延迟。
  • 数据采样:对于数据量非常大的网站或应用,GA4 可能会对数据进行抽样,这可能会影响报告的准确性。
  • 事件参数:你可以在事件报告中点击具体的事件名称,查看与该事件相关的参数数据。在探索报告中,你可以将事件参数作为维度进行分析。
暂无评论

发送评论 编辑评论


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇