使用数据层跟踪基于事件的规则

Question

这有点令人困惑。假设我已经实现了一个带有页面详细信息的数据层。该页面有 2 篇文章，每次点击都会重定向。现在假设跟踪是这样的，一旦用户点击卡片，工具中将报告卡片名称（h1）名称。我在没有使用数据层的情况下实现了这个场景。 (Looking for custom script in Adobe DTM data element?)。

下面提到了我定义数据层的代码。在 DTM 控制台中，我创建了数据元素，并与数据层对象进行了映射。卡片名称 - DDO.pageData.cardname。还创建了一个基于事件的规则并使用此数据元素进行映射。这里的问题是，每当我单击一篇文章时，它都会在单个 evar 中获取两篇文章的 h1。理想情况下，它应该只取被点击的文章的值。请建议。

<article class="mu-item">
  <a href="www.google.com" data-tags="test" target="_blank">
    <div>
      <h1>This is a test text for tracking</h1>
        <p>This was the day when the South Stand at Old Trafford, the stadium where he played around half of his 758 matches for United, was officially renamed in his honour before his beloved Reds took on Everton in the Barclays Premier League.<br><br>
      </p>
    </div>
  </a>
 </article>

<article class="mu-item">
  <a href="www.facebook.com" data-tags="{{displaytag_2}}" target="_blank"> 
    <div>
      <h1>This is new card</h1>
        <p>This was the day when the South Stand at Old Trafford.<br><br>
      </p>
    </div>
  </a>
</article>

<a href="#" class="link"><span>some text</span></a>

<script type="text/javascript">  
 DDO = {} // Data Layer Object Created
 var pageObj = {};
 var pageDOM = $('.mu-item');
 pageObj.DestinationURL = $(pageDOM).find('a').attr('href');
 pageObj.cardName = $(pageDOM).find('h1').text();
  
 DDO.pageData = {
    "pageName": document.title,
    "DestinationURL":pageObj.DestinationURL,
    "cardname":pageObj.cardName
  }  
</script>
<script type="text/javascript">_satellite.pageBottom();</script>

Answer 1

正如其他人所提到的，知道哪个h1 值相关的唯一方法是在点击事件期间捕获它。

正如我在comments of your other question中提到的那样

[..] DTM 目前没有将对this 的引用传递给在配置区域中创建的数据元素

没有办法解决这个问题。您必须在点击事件期间捕获它，正如我在您的其他问题（规则条件内的自定义脚本）中向您展示的那样。正如其他人所提到的，让它通过你的数据层在技术上是一个不必要的步骤。实际这样做有利有弊，但这是一个不同的讨论。

假设你下定决心……

转到规则 > 数据元素，然后点击创建新数据元素。

根据您使用的任何约定

命名您的数据元素。对于数据层，我个人喜欢将其命名为完整的数据层路径，例如“DDO.pageData.cardName”。

对于类型，选择“JS 对象”。

路径，填写完整路径DDO.pageData.cardName

单击保存数据元素以保存数据元素。

接下来，转到您的基于事件的规则。它应该仍然具有与您相同的事件类型（点击）和元素标记或选择器（article.mu-item）。

在您的规则条件中，选择“数据 > 自定义”以添加自定义 js 代码框。

在这里，您仍然需要获取基于this 的信息。但不是使用_satellite.setVar() 创建动态数据元素，而是将值推送到数据层。

示例：

var articleTitle = $(this).find('h1').text()||'';
window.DDO
 &&
window.DDO.pageData
 &&
(window.DDO.pageData.cardName=articleTitle);
return true;

注意：我使用 jQuery 语法来获取 h1 文本。根据您之前的问题，您当时遇到了麻烦，所以我向您展示了 vanilla js 版本。不知道你是否解决了这个问题，但你明白了这个原则。

现在您可以在规则的其余字段%DDO.pageData.cardName% 中使用数据层引用的数据元素@

Answer 2

您的问题是您有多个菜单项和标题。您要么必须创建一个包含所有标题的数组（这将很难获得正确的点击条目），要么仅在点击元素后填充数据层，因此它始终包含所选元素的数据。

但是，正如我指出的那样，您很有可能不需要这个。如果您使用 css 选择器执行基于事件的单击规则，则您可以使用 DTM 自动创建的数据元素 - 它称为 %this% 并包含单击的 DOM 节点。您应该能够使用 %this.textContent% 获取标题内的文本（您的标题中有一个嵌套段落，我不确定它是否是有效的 HTML，因此您必须在事件规则配置中允许事件冒泡）。