我如何在 Google 标签管理器中使用 html 的自定义属性来跟踪对大量按钮的点击

Question

我有一些长长的按钮列表。 例如，我有一个单一的汽车模型列表，它们都具有相同的自定义数据属性“modellist”，而它们还有另一个数据属性，即该汽车的名称 model（请注意，这些按钮不是链接）。 所附图片现在，无需为这些按钮中的每一个创建单个标签，我需要使用谷歌标签管理器和 GA4（谷歌分析 4）为这种情况找到一种更快的方法，这样我就可以能够跟踪对这些按钮的点击。 有谁知道我该怎么做？ 我非常感谢您在这里的帮助和支持。

Answer 1

以下是步骤和操作方法。

1. 创建Custom JavaScript Variable ；

这是屏幕截图

代码是：

function(){
  // Get the click element;
  var clickElement = {{Click Element}};

  // Check there is a closet parent element you want. If it doesn't then return false;
  if(!clickElement.closest("div.stepped-selection__list-item"))
    return false;
  
  // Check the parent dom has the attribute you want. 
  // If it does, return the attribute value. Otherwise, return false;
  var modelListDom = clickElement.closest("div.stepped-selection__list-item");
  if(modelListDom.hasAttribute("data-trackervalue")){
    return modelListDom.getAttribute("data-trackervalue");
  }
  return false;
}

---

2. 创建触发器

这是屏幕截图：

首先，使用click element > match css selector > 来捕捉选择器内的所有元素。 您可以对其进行一些修改以使其更适合您的实际情况。

其次，我们在 step1 中创建的Variable 。 如果不是我们预期的，它将返回 false。 因此，如果Variable返回 false，我们不想触发标签。

---

3. 创建标签。

Tag配置是最简单的。

只需在步骤 2 中使用Trigger 。

并给出你想要的事件名称和事件参数。

将事件参数值作为步骤 1 中的Variable 。