谷歌标签管理器中的谷歌分析事件跟踪

Google Analytics Event Tracking in Google Tag Manager

本文关键字：谷歌 事件 跟踪 标签 管理器      更新时间：2023-09-26

我对分析事件跟踪等相对陌生。

我只是想知道什么是谷歌标签管理器相当于谷歌分析（onchange="ga('send', 'event', 'Category', 'Change', 'Value');"）？

我知道我可以使用onlayer，但我不是100%确定如何使用它，试着在网上查找了一些文章，但没有什么能帮助我。

基本上，我有一个样式化的select元素，当它更改值时，我想跟踪它。没有提交按钮，它也不在表单元素中。

谷歌标签管理器只允许我点击，它返回错误的值，因为它是一个选择元素，需要onchange而不是onclick。

我的问题是，如果有意义的话，我可以在谷歌标签管理器中使用谷歌分析事件跟踪代码吗？我的谷歌分析是通过谷歌标签管理器插入的，跟踪也是如此。

感谢您的回复，

如果我实现了这一点，我会创建一个自定义HTML标记，其中包含一个绑定到select元素的onchange事件的函数。该函数将向dataLayer中激发一个自定义事件，该事件还包含相关信息。然后，您将创建一个UA事件跟踪标记，该标记使用正确的信息，并由自定义事件名称触发的自定义触发器触发。

因此，如下所示：

  1. 创建具有类似功能的自定义HTML标记，在您想要绑定到选择元素的所有页面的DOM上启动它：

    <script>
  $('#myselect').on('change', function(){
    dataLayer.push({
      'event':'select_change',
      'select_val':this.value
    });
  });
</script>

  2. 创建类型为custom event的触发器，其中事件值=select_change

  3. 创建一个通用分析标记，它是一个事件标记，并填写所需的详细信息（类别、操作、标签、值）。如果是我，我会用这样的东西
    • category=用户交互
    • action=选择更改
    • label＝｛｛select_val｝｝

这个标记应该由您在2中创建的触发器触发。

就我个人而言，我采用了Simo Ahava推荐的"通用事件标记"方法。这一切都归功于他，但我会在这里总结一下。

您可以创建一个处理任何事件的通用标签，而不是将GTM容器与各种GA事件的一堆专业标签混为一谈。使用下面的代码，您可以将事件推送到dataLayer，它们将自动传递到GA.

dataLayer.push({
  'event' : 'GAEvent',
  'eventCategory' : value_for_Event_Category,
  'eventAction' : value_for_Event_Action,
  'eventLabel' : value_for_Event_Label,
  'eventValue' : value_for_Event_Value
});

由于所有事件都由一个类别、操作、标签和值组成，因此为每个事件创建一个dataLayer变量。然后创建一个将在所有自定义事件上触发的自定义事件触发器，并查找您设置的事件名称（Simo使用名称"GAEvent"）。最后创建一个新的GA标记。将标记类型设置为event，并将类别、操作、标签和值映射到dataLayer变量。使用您刚刚创建的触发器来触发此标记。这是GTM方面的观点。

注意：您不需要为每个事件设置标签和值。如果不需要，您可以简单地省略它们，或者手动将它们设置为"未定义"。此外，如果您有许多非交互事件，您可能希望创建触发器和标记的非交互版本，以便您也可以通用地推送这些事件

如果我实现了这一点，我将创建一个自定义HTML标记，其中包含>函数，该函数绑定到select元素的onchange事件。>函数会将自定义事件激发到dataLayer中，该dataLayer还包含>相关信息。然后，您将创建UA事件跟踪标签，该标签>使用正确的信息并且由被触发的自定义触发器触发>按自定义事件名称。

因此，如下所示：

1.创建具有与此类似功能的自定义HTML标记，将其激发>在所有要绑定到select元素的页面的DOM上：

<script>
 $('#myselect').on('change', function(){
   dataLayer.push({
     'event':'select_change',
     'select_val':this.value
   });
 });

2.创建自定义事件类型的触发器，其中事件值=select_change
3.创建作为事件标签的通用分析标签，并填写>所需的详细信息（类别、操作、标签、值）。如果这是我，我会>使用类似

的内容-category=用户交互
-action=选择更改
-label＝｛｛select_val｝｝

这个标记应该由您在2中创建的触发器触发。

我一直在寻找完全相同问题的解决方案，dmpg_tom的解决方案效果很好。

我遇到了一个问题，因为我的下拉列表的值被设置为1、2、3、4等，我需要提取文本。我试过了。文本和这个。HTML和两者都不起作用。

在这里的一些帮助下，我编辑了如下代码：

<script>
 $('#myselect').on('change', function(){
var mySelect = document.getElementById("myselect");
var selectedText = mySelect.options[mySelect.selectedIndex].text;
  dataLayer.push({
  'event':'select_change',
  'select_val':selectedText
});
});
</script>

在本例中，它现在将返回"Hello"而不是"1"
<option value="1">Hello</option>

相关文章：