捕获元素的点击 ID，然后使用 GTM 将其附加到传出 URL

Question

我正在尝试使用 Google 标签管理器将传出 link 附加到具有一些 UTM 信息的特定域。

我已经成功重写了页面加载的 html，如下所示：

<script type="text/javascript">
//
var myDomain = "www.target.com";
//
var links = document.getElementsByTagName('a');
// Loop 
Array.prototype.forEach.call(links, function (link) {
// Link check
if ( link.href.indexOf(myDomain) > 0 ) {
   // Take the href and append the UTM parameters
   link.href += "?utm_source=" + {{UTMsource}} + "&utm_campaign=target_blog&utm_medium=" + {{UTMmedium}} + "&utm_term=&utm_content=";
}
});
</script>

{{UTMsource}} 正在捕获当前页面 URL。我无法让 {{UTMmedium}} 捕获用户离开网站时点击的点击元素的 ID。

我可以使用以下 CSS 选择器捕获元素的文本：a[href*="target.com"] 但是，如果页面上有多个 link，它只会从页面上找到的第一个 link 中获取文本。

我想捕获被点击元素的 ID，然后让 {{UTMmedium}} 捕获该信息以包含在传出的 UTM 代码中 link。

Answer 1

您遇到的问题是因为 GTM 是运行您在页面加载时的 HTML 标签。

因为变量 (UTMmedium) 还没有机会被填充（没有点击事件），这个值将是未定义的。

另一个问题是 GTM 只会收集单个静态值，然后会在加载的所有链接上输入该单个 ID。

不使用变量，而是修改循环并在捕获 href 的同时使用 js 捕获 id，如下所示：

// Link check
if ( link.href.indexOf(myDomain) > 0 ) {
   // Take the href and append the UTM parameters
   link.href += "?utm_source=" + {{UTMsource}} + 
   "&utm_campaign=target_blog&utm_medium=" + link.id + 
   "&utm_term=&utm_content=";
    }

捕获元素的点击 ID，然后使用 GTM 将其附加到传出 URL

Capture the on-click ID of an element, then append it to an outgoing URL using GTM

html

javascript

css

google-analytics

google-tag-manager