带有 CSS 选择器的单击元素在 Google 跟踪代码管理器中不起作用

Question

如何使用 Google 标签管理器中的“Click Element”变量检测对以下元素的点击：

<a href="https://amazon.in/product-id" target="_blank" class="amazon-btn">
    <div>
        <span>BUY NOW AT</span>
        <div class="amz-logo"></div>
    </div>
</a>

我创建了以下触发器：

Click - All Elements -> Some Clicks -> Click Element -> matches CSS selector -> *.amazon-btn*

Answer 1

在触发器配置中，尝试添加此条件：

Click Element

matches CSS selector

.amazon-btn, .amazon-btn *

我还没有对此进行测试，但当具有

amazon-btn

类的元素是点击目标或该元素内的任何子元素时，它应该可以工作。

Answer 2

这就是问题所在，

Click - All Elements

触发器返回被单击的实际元素（显然），但那可能只是更大按钮中的图标。而我们想要捕获按钮或目标元素上任意位置的点击。有关此内容的更多信息，请访问此链接

这就是我最终使用的。我创建了一个自定义 JavaScript 变量

Get All Classes

:

function() {
  var el = {{Click Element}};
  var ad = el.nodeName.toLowerCase();
  if(!el.className==''){
    ad = ad+'.'+el.className.replace(/\s/g,'.');
  }
  var i = 0
  while(el.parentElement.nodeName.toLowerCase() != 'body' && i < 50){
    el = el.parentElement;
    var st = el.nodeName.toLowerCase();
    if(!el.className==''){
      st = st+'.'+el.className.replace(/\s/g,'.');
    }
    ad = st+'>'+ad;
    i++;
  }
  return ad;
}

这将返回一个字符串，其中包含从单击的元素开始一直到

<body>

元素的所有节点名称及其类。像这样：

body>div.main-container.content>p.first-section>a.amazon-link

然后我在触发器中使用这个变量来检查它是否包含特定的类。

有没有一种更简单、更好的方法来获取下面突出显示的字符串形式的 {{Click Element}} GTM 变量的值？如果是这样，请将其添加为答案，我会接受它作为正确答案。

Answer 3

尝试点击锚元素

不要使用“单击>所有元素”

使用“点击 > 仅链接”

然后应用 CSS 选择器

Answer 4

我找到了解决这个问题的解决方案：

触发：单击 - 所有元素 -> 部分单击 -> 单击元素 -> 匹配 CSS 选择器 -> "a.amazon-btn > div"

请通过 PayPal 转账至 [email protected] 表达您的谢意 :)）））

Answer 5

使用 Click Text = BUY NOW AT 代替 Click Element，就完成了。

或者使用“Chrome 的 CSS 选择器助手扩展”之类的东西来生成正确的 CSS 选择器。

带有 CSS 选择器的单击元素在 Google 跟踪代码管理器中不起作用

问题描述投票：0回答：5

5个回答

最新问题

带有 CSS 选择器的单击元素在 Google 跟踪代码管理器中不起作用

问题描述 投票：0回答：5

5个回答

最新问题

问题描述投票：0回答：5