自定义事件如何使用Google Tag Manager与AMP配合使用？

Question

我已经在我的网站的所有AMP页面上使用这个。

<script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
<amp-analytics config="https://www.googletagmanager.com/amp.json?id=GTM-XXXXX&gtm.url=SOURCE_URL" data-credentials="include"></amp-analytics>

但是我需要使用上面的方法来触发自定义事件。

Answer 1

请通过这些步骤，希望它能有所帮助。如果答案有帮助，请接受它。

要安装AMP的Tag Manager，请执行以下操作：

1.)在标记管理器中创建一个AMP容器。

2.)将Tag Manager代码片段添加到AMP页面。

3.)在Tag Manager容器中配置标记并发布。

创建AMP容器标签管理器具有AMP容器类型。为您的项目创建新的AMP容器：

1.)在帐户屏幕上，单击要使用的帐户的更多操作(更多)。选择Create Container。

2.)为容器命名。使用描述性名称，例如"example.com - news - AMP“。

3.)在Where to Use Container下，选择AMP。

4.)单击Create。

您的容器现在已准备就绪。下一步是在AMP页面上安装Tag Manager代码。

添加Tag Manager代码片段创建新的AMP容器后，将出现Install Google Tag Manager屏幕。Tag Manager提供了两个代码片段。复制这些代码片段，使其显示在AMP页面上。

第一个代码片段将amp-analytics组件添加到AMP页面。此代码放在页面部分的末尾，并且应该只在页面上出现一次。

<!-- AMP Analytics --><script async custom-element="amp-analytics" 
src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>

第二个代码片段将amp-analytics配置为使用Tag Manager。将此代码紧跟在开始元素之后。将GTM- container _ID替换为标记管理器的容器ID，或从标记管理器用户界面复制并粘贴整个代码段。

配置您的容器并发布当您的页面正确安装了容器片段时，它们将能够触发从Tag Manager部署的标记。下一步是创建标签配置并发布容器。

要创建新标记，请执行以下操作：

1.)单击标记，然后单击新建。

2.)点击标签配置，从支持的AMP标签列表中选择标签类型。

3.)使用您的标签厂商提供的信息配置标签。

4.)点击触发，添加一个或多个触发标签的事件条件。

5.)命名触发器，然后单击保存。

对任何其他标记配置重复这些步骤。当您的容器配置就绪后，发布您的容器以使更改生效。

页面变量Tag Manager可以捕获AMP变量，并在标记和触发器配置中使用它们。例如，销售鞋子的页面可能具有描述特定鞋子属性的变量。这些值可用于创建Tag Manager变量：

 <amp-analytics config="https://www.googletagmanager.com/amp.json?id=Tag Manager- 
 XXXXXX;Tag Manager.url=SOURCE_URL" data-credentials="include">
 <script type="application/json ">
  {
      "vars" : {
          "type": "shoes",
          "color": "red"
      }
   }
  </script>
  </amp-analytics>

要在Tag Manager中创建用户定义的变量，以从上述代码中捕获颜色变量：

1.)单击变量。

2.)在用户定义的变量下，单击新建。

3.)单击Variable Configuration并选择AMP Variable。

4.)在Amp变量名称字段中，输入字段名称(例如“color”。)

5.)为变量指定一个描述性名称(例如"AMP可变颜色“。)

6.)单击保存。