Show Menu
主题×

使用Adobe Client Data Layer集成核心组件和Adobe Analytics

此文档详细介绍了如何设置基于AEM、Adobe Client Data Layer、Adobe Launch和Adobe Analytics的端对端配置以跟踪:
  • 载入页面时存储在Adobe客户端数据层中的页面ID
  • 单击图像时存储在Adobe客户端数据层中的图像路径
它以核心组件为例,但可用于您自己的自定义组件。

第1步——在Adobe Analytics中创建报表包

要聚合和分析数据,必须先创建报表包。
  1. 转到 https://analytics.adobe.com .
  2. 使用您的Adobe ID登录。
  3. Click the Analytics icon.
  4. 转至“管 理员”->“报表包”
  5. 单击 新建->报表包
  6. 填写表单:
    1. 报表包 ID : yourSuiteID
    2. 站点标题 : Your suite description
    3. 时区 : 酌情
    4. 起始日期 : 当天或酌情
    5. 估计每天的页面视图 : 100或酌情
  7. 单击 创建报表包
如果成功,您将以绿色收到以下消息: Report Suite <yourReportSuite> has been successfully created.

第2步——使报表包可见

要使用新报表包,必须可见。
  1. 转到 https://adminconsole.adobe.com .
  2. 使用您的Adobe ID登录。
  3. 单击 Adobe Analytics - <您的站点>卡
  4. 单击“ Adobe Analytics - <您的站点> ”链接
  5. Select the Permissions tab
  6. 单击“ 报表 包”行 的“编辑 ”按钮
  7. 单击您 步骤1中创建的报表包的+ 按钮 ,将其添加到“包 含的权限项 ”类别。
  8. 单击​ 保存

步骤3 —— 将AEM站点与Adobe Launch集成

必须将Launch与AEM站点集成,才能生成数据。
按照使用Adobe Client Data 层中的步骤集成核心组件和Adobe Launch 文档。

第4步——在Adobe Launch中安装和配置Adobe Analytics扩展

Adobe Analytics Extension支持Analytics与Launch的集成。
  1. 在Adobe Launch中,选择您在步骤3中创建的新 添加属性。
  2. 导航到“扩 ”选项卡并选 择目录
  3. 搜索 Adobe Analytics
  4. 单击​ 安装
  5. 配置扩展。
    1. 输入在 步骤1中为相应​ 环境创建的 Analytics Report Suite ID
    2. 将字 符集设 置为UTF-8
  6. 单击保存

第5步——在Adobe Launch中为页面ID创建数据元素

启动项中需要数据元素才能跟踪页面ID。
  1. 在Adobe Launch中,选择在步骤3中创建 的属性。
  2. 选择“数 据元素 ”选项卡,然 后单击“添加数据元素 :
    1. 名称 : dl-page-id
    2. 扩展 : 核心
    3. 数据元素类型 : 自定义代码
  3. 单击“ 打开编辑器”
  4. 在编辑器中,输入代码: return adobeDataLayer.getState().page.id;
  5. 单击​ 保存
  6. 单击 保存 ,以创建数据元素。

第6步——在Adobe Launch中创建规则以在Analytics中跟踪页面ID

规则允许跟踪Analytics中的页面ID等浏览属性。
重复使用Adobe Client Data Layer集 成核心组件和Adobe Launch文档第5b部分中的步骤 ,在Adobe Launch中添加以下规则:
  • 名称 : track-dl-page-id
  • 事件:
    • 扩展 : 核心
    • 事件类型 : 页面底部
  • 操作1:
    • 扩展 : Adobe Analytics
    • 操作类型 : 设置变量
    • prop1 : %dl-page-id%
  • 操作2:
    • 扩展 : Adobe Analytics
    • 操作类型 : 发送信标
    • 查s.t(): 将数据发送到Adobe Analytics并视其为页面视图

第7步——在Adobe Launch中创建规则以注册图像单击事件

规则允许跟踪浏览属性,如Analytics中的单击事件。
重复使用Adobe Client Data Layer集 成核心组件和Adobe Launch文档第5b部分中的步骤 ,在Adobe Launch中添加以下规则:
  • 名称 : register-dl-image-click
  • 事件:
    • 扩展 : 核心
    • 事件类型 : 页面底部
  • 操作1:
    • 扩展 : 核心
    • 操作类型 : 自定义代码
    • 编辑器: 输入以下代码
      var myListener = function(event) {
        _satellite.track('dlImageClicked', event.info.path);
      };
      adobeDataLayer.addEventListener('image clicked', myListener());
      
      

第8步——在Adobe Launch中创建规则以跟踪Analytics中的图像单击事件

规则允许跟踪浏览属性,如Analytics中的单击事件。
重复使用Adobe Client Data Layer集 成核心组件和Adobe Launch文档第5b部分中的步骤 ,在Adobe Launch中添加以下规则:
  • 名称 : track-dl-image-click
  • 事件:
    • 扩展 : 核心
    • 事件类型 : 直接呼叫
    • 标识符 : dlImageClicked
  • 操作1:
    • 扩展 : Adobe Analytics
    • 操作类型 : 设置变量
    • prop2 : 设置为 %event.detail%
  • 操作2:
    • 扩展 : Adobe Analytics
    • 操作类型 : 发送信标
    • 查s.t(): 将数据发送到Adobe Analytics并视其为页面视图

第9步——将启动代码发布到您的网站

要在启动项中启用对这些规则和属性的跟踪,必须发布代码。
  1. 在Adobe Launch选项卡 ,选择“发 布”选 项卡。
  2. 单击“ 添加新库”
  3. 输入 名称 : data-layer-analytics-1 .
  4. 作为 环境 , 选择开发(开发)
  5. 单击“ 添加所有更改的资源”
  6. 对于以下三个规则( track-dl-page-id register-dl-image-click track-dl-image-click ):
  7. 选择 规则->规则->最新 ,然后 单击选择并创建新修订
  8. 单击​ 保存并构建用于开发

第10步——触发页面将信息发送到Adobe Analytics

在此步骤中,您将安装Chrome扩 展Launch和DTM Switch 。 借助此扩展,您只需构建启动代码并将其部署到开发环境。 无需部署暂存和生产环境。
  1. 从Discovery安装Chrome 扩展Launch和DTM Switch。
  2. 单击“ 启动开关 ”图标,将“调试”设 置为ON
  3. 重新加载页面 http://<host>:<port>/content/core-components-examples/library/image.html .
  4. 打开浏览器控制台,您会看到类似以下内容的内容。
您还可以安装 Chrome的Experience Cloud Debugger扩展,以视图Adobe Launch和Analytics有关页面的特定信息。

第11步——在Adobe Analytics中视图跟踪信息

现在,您可以视图在Adobe Analytics中触发的事件。
  1. 转到 https://analytics.adobe.com .
  2. 使用您的Adobe ID登录。
  3. Click the Analytics icon.
  4. Select the Reports tab.
  5. 在右上方的下拉菜单中,选择您在步骤1中创建的 报表包。
  6. 在第一列中,选 择自定义流量->自定义流量1-10 ->自定义分析 1以视图数据层中存储的跟踪页面ID(路径)。 它应类似于以下内容。
  7. 访问 Custom Insight 2 ,视图数据层中存储的跟踪图像路径。 它应类似于以下内容。