发送页面查看信标
现在,您将创建一个规则以触发 Analytics 信标,进而发送在扩展配置中设置的 Page Name 变量。
您已在本教程的添加数据元素、规则和库课程中创建“All Pages - Library Loaded”规则,该规则将在加载标记库时在每个页面上触发。 您 也可以 将此规则用于Analytics,但此设置要求先定义Analytics信标中使用的所有数据层属性,然后再定义标记嵌入代码。 为增加数据收集的灵活性,您将新建一个在 DOM 就绪时触发的“所有页面”规则,以触发 Analytics 信标。
发送页面查看信标
-
转到左侧导航中的 规则 部分,然后单击 添加规则
-
将规则命名为
All Pages - DOM Ready
-
单击 事件>添加 以打开
Event Configuration
屏幕 -
选择 Event Type > DOM Ready(请注意,该规则的顺序为“50”)
-
单击 保留更改
-
在 Actions 下,单击
-
选择 扩展> Adobe Analytics
-
选择 操作类型>发送信标
-
将 Tracking 保留设置为
s.t()
。请注意,如果您想要在点击事件规则中发起s.tl()
调用,则也可以使用 Send Beacon 操作来实现这一点。 -
单击 保留更改 按钮
-
单击 保存到库并生成
验证页面查看信标
现在,您已创建用于发送 Analytics 信标的规则,接下来应该能够在 Experience Cloud Debugger 中看到相应请求。
使用规则添加变量
配置 Analytics 扩展后,您便在扩展配置中填充了 pageName
变量。如果在加载标记嵌入代码之前页面上就有可用的值,那么也可以在扩展配置中填充其他全局变量,如eVar和prop。
要更加灵活地设置变量和事件,可以通过在规则中使用 Set Variables
操作来实现。使用规则,您可以在不同的条件下设置不同的 Analytics 变量和事件。例如,之前,您只能在产品详细信息页面上设置 prodView
事件,且只能在订单确认页面上设置 purchase
事件。此部分将向您讲授如何使用规则设置变量。
用例
产品详细信息页面 (PDP) 是零售网站上的重要数据收集点。一般情况下,您会希望 Analytics 记录发生的产品查看事件以及查看的产品。这有助于您了解哪些产品在客户中受欢迎。在媒体网站上,文章或视频页面也可以使用类似于您在此部分所使用的跟踪技术。加载产品详细信息页面时,您可能希望将该值放入“页面类型”eVar
中,并设置一些事件和产品 ID。这使我们能够在分析中了解以下信息:
- 产品详细信息页面的加载次数是多少
- 查看了哪些特定产品以及查看次数是多少
- 其他因素(促销活动、搜索等)如何影响 PDP 的用户加载量
为页面类型创建数据元素
首先,您需要确定哪些页面属于产品详细信息页面。您可以使用数据元素来执行该操作。
为页面类型创建数据元素
-
在左侧导航中单击 数据元素
-
单击 添加数据元素
-
将数据元素命名为
Page Type
-
选择 数据元素类型> JavaScript变量
-
使用
digitalData.page.category.type
作为 JavaScript变量名称 -
检查 清除文本 和 强制小写 选项
-
单击 保存到库
为产品 ID 创建数据元素
接下来,您将使用数据元素收集当前产品详细信息页面中的产品 ID
为产品 ID 创建数据元素
-
在左侧导航中单击 数据元素
-
单击 添加数据元素
-
将数据元素命名为
Product Id
-
选择 数据元素类型> JavaScript变量
-
使用
digitalData.product.0.productInfo.sku
作为 JavaScript变量名称 -
检查 清除文本 和 强制小写 选项
-
单击 保存到库
添加 Adobe Analytics Product String 扩展
如果您已经熟悉 Adobe Analytics 实施,则可能也熟悉产品变量。产品变量具有非常具体的语法,而且其使用方式会因上下文而略有不同。为帮助在标记中更轻松地填充产品变量,已在标记扩展市场中创建了三个其他扩展! 在此部分中,您将添加一个由 Adobe 咨询团队创建的扩展,以将其用在产品详细信息页面中。
添加 Adobe Analytics Product String
扩展
-
转到 Extensions > Catalog 页面
-
找到由Adobe Consulting服务创建的
Adobe Analytics Product String
扩展,然后单击 安装
-
花些时间阅读相关说明
-
单击 保存到库
为产品详细信息页面创建规则
现在,您将使用新的数据元素和扩展来构建产品详细信息页面规则。对于此功能,您将再创建一个在 DOM 就绪时触发的页面加载规则。但是,您将使用相应条件以便该规则只在产品详细信息页面上触发,并设置顺序以便该规则在用于发送信标的规则“之前”触发。__
构建产品详细信息页面规则
-
转到左侧导航中的 规则 部分,然后单击 添加规则
-
将规则命名为
Product Details - DOM Ready - 40
-
单击 事件>添加 以打开
Event Configuration
屏幕 -
选择 事件类型> DOM就绪
-
将 Order 设置为40,以便该规则在 包含Analytics > Send Beacon操作的规则之前 运行
-
单击 保留更改
-
在 条件 下,单击
Condition Configuration
屏幕
-
选择 条件类型>值比较
-
使用数据元素选取器,在第一个字段中选择
Page Type
-
从比较运算符下拉列表中选择 Contains
-
在下一个字段中键入
product-page
(这是从 PDP 上的数据层提取的页面类型值的独特部分) -
单击 保留更改
-
-
在 Actions 下,单击
-
选择 扩展> Adobe Analytics Product String
-
选择 操作类型>设置s.products
-
在 Analytics电子商务事件 部分中,选择 prodView
-
在 产品数据的数据层变量 节中,使用数据元素选取器选择
Product Id
数据元素 -
单击 保留更改
-
在 Actions 下,单击
-
选择 扩展> Adobe Analytics
-
选择 操作类型>设置变量
-
选择 eVar1 >设置为 并输入
product detail page
-
设置 event1,并将可选值留空
-
在“事件”下,单击 添加其他 按钮
-
设置 prodView 事件,并将可选值留空
-
单击 保留更改
-
单击 保存到库并生成
验证产品详细信息页面数据
您刚刚创建了一个规则,该规则会在发送信标之前设置变量。现在,您应该能够在 Experience Cloud Debugger 中查看在点击中传出的新数据。
验证产品详细信息页面数据
-
在 Chrome 浏览器中打开 Luma 网站
-
导航到任意产品详细信息页面
-
单击Debugger图标
-
单击 Analytics 选项卡
-
展开您的报表包
-
请注意当前位于 Debugger 中的产品详细信息变量,即:
eVar1
已设置为“product detail page”,Events
变量已设置为“event1”和“prodView”,Products 变量已设置为您正在查看的产品的产品 ID,并且 Page Name 仍由 Analytics 扩展进行设置
发送跟踪链接信标
页面加载时,通常会触发由 s.t()
函数触发的页面加载信标。这会自动递增在 pageName
变量中列出的页面的 page view
量度。
但是,有时候您不希望递增网站上的页面查看次数,因为正在执行的操作“不足以”计为一次页面查看,或者可能根本不属于页面查看。在这种情况下,将使用 s.tl()
函数,该函数通常称为“跟踪链接”请求。虽然它称为跟踪链接请求,但不需要在单击链接时触发。该请求可以由标记规则生成器中可用的 任意 事件触发,包括您自己的自定义JavaScript。
在本教程中,您将使用最酷的 JavaScript 事件之一(Enters Viewport
事件)来触发 s.tl()
调用。
用例
对于此用例,您希望了解用户是否在Luma主页上向下滚动到足够远的位置,以查看我们页面的 特色产品 部分。 我们公司内部对于用户是否查看了该部分存在一些分歧,因此您希望使用 Analytics 查明真相。
在标记中创建规则
-
转到左侧导航中的 规则 部分,然后单击 添加规则
-
将规则命名为
Homepage - Featured Products enters Viewport
-
单击 事件>添加 以打开
Event Configuration
屏幕 -
选择 Event Type > Enters Viewport。 此时将显示一个字段,您需要在其中输入 CSS 选择器,该选择器将标识页面上应在进入浏览器视区时触发此规则的项目。
-
返回到Luma主页,然后向下滚动到精选产品部分。
-
右键单击“精选产品”标题与此部分所含项目之间的空白处,然后从右键单击菜单中选择
Inspect
。 这会将您引导至目标位置附近。 -
在目标位置附近,可能就在选定部分正下方,您需要查找包含
class="we-productgrid aem-GridColumn aem-GridColumn--default--12"
的 div。找到该元素。 -
右键单击此元素,然后选择 复制>复制选择器
-
返回标记,并将此值从剪贴板粘贴到标记为
Elements matching the CSS selector
的字段中。- 有一点要注意,如何标识 CSS 选择器将由您来决定。此方法存在一些缺陷,因为页面上的某些更改可能会破坏此选择器。在标记中使用任何CSS选择器时,请考虑这一点。
-
单击 保留更改
-
在 Conditions 下,单击
-
选择 条件类型>值比较
-
使用数据元素选取器,在第一个字段中选择
Page Name
-
从比较运算符下拉列表中选择 等于
-
在下一个字段中键入
content:luma:us:en
(这是从数据层提取的主页的页面名称 - 我们只希望此规则在主页上运行) -
单击 保留更改
-
在 Actions 下,单击
-
选择 扩展> Adobe Analytics
-
选择 操作类型>设置变量
-
将
eVar3
设置为Home Page - Featured Products
-
将
prop3
设置为Home Page - Featured Products
-
将
Events
变量设置为event3
-
单击 保留更改
-
在 Actions 下,单击
-
选择 扩展> Adobe Analytics
-
选择 操作类型>发送信标
-
选择
s.tl()
跟踪选项 -
在 链接名称 字段中,输入
Scrolled down to Featured Products
。 此值将放入 Analytics 的“自定义链接”报表中。 -
单击 保留更改
-
单击 保存到库并生成
验证跟踪链接信标
现在,您将需要确保在向下滚动到我们网站主页的“精选产品”部分时会计入此点击。 第一次加载主页时,不应发起该请求,但在向下滚动直至 New Arrivals 部分可见后,该点击应触发我们的新值。
-
在 Chrome 浏览器中打开 Luma 网站,并确保您位于主页顶部。
-
单击 调试器图标
-
单击 Analytics 选项卡
-
展开您的报表包点击
-
请注意主页的常规页面查看点击中的页面名称等(但 eVar3 或 prop3 中没有任何内容)。
-
保持Debugger处于打开状态,在您的网站上向下滚动,直至看到“精选产品”部分
-
再次查看 Debugger,此时应该出现另一次 Analytics 点击。此点击应具有与您设置的 s.tl() 点击相关联的参数,即:
-
LinkType = "link_o"
(这表示此点击是自定义链接点击,而不是页面查看点击) -
LinkName = "Scrolled down to Featured Products"
-
prop3 = "Home Page - Featured Products"
-
eVar3 = "Home Page - Featured Products"
-
Events = "event3"
-
添加插件
插件是一段 JavaScript 代码,您可以将该代码添加到实施中以执行未内置到产品中的特定功能。插件既可以由您自行构建,也可以由其他 Adobe 客户/合作伙伴或 Adobe 咨询团队构建。
要实施插件,基本上有三个步骤:
- 包含将引用插件的 doPlugins 函数
- 添加插件的主函数代码
- 包含用于调用函数、设置变量和执行其他操作的代码
使 Analytics 对象可全局访问
如果您将要添加 doPlugins 函数(如下所示)并使用插件,则需要选中用于使 Analytics“s”对象在 Analytics 实施中全局可用的复选框。
-
转到 扩展>已安装
-
在Adobe Analytics扩展中,单击 配置
-
在 库管理 下,选中标记为
Make tracker globally accessible
的框。 正如您在帮助气泡中所看到的,选中该复选框将导致跟踪器在 window.s 下的范围设置为全局,如果您希望在客户 JavaScript 中引用它,则务必要这样做。