javascript - 如何将 Google 标签管理器与使用 JSON-LD 和变量的多模式产品评论结合使用

标签 javascript html schema google-tag-manager json-ld

因此,我使用 Google 跟踪代码管理器将 Schema JSON-LD 产品评论添加到某些页面,但我遇到了问题,无法找到有关该问题的任何资源。

我遇到的问题是如何告诉 GTM 有多个元素并且它们应该在 JSON-LD 中重复,每个元素都有其唯一值。

我用来获取值的方法是使用 CSS 选择器,它不是唯一的,因为它们在某些页面上可以出现 20 次,而在其他页面上可以出现 30 次。变量通过Google GTM获取。

在我添加的所有页面上使用 Google 跟踪代码管理器自定义 HTML

<script>
(function() {

var data = { 

  // THIS APPEARS ONCE.      
  "@context": "http://schema.org",
  "@type": "Product",
  "name": "{{name}}",
  "aggregateRating":
    {
      "@type": "AggregateRating",
      "ratingValue": "{{rating}}",
      "reviewCount": "{{ratingCount}}"
    }

    // THIS BLOCK OF CODE NEEDS TO BE REPEATED EVERYTIME VARIBLE  {{customer}} IS FOUND
    "review": [
      {
        "@type": "Review",
        "author": "{{customer}}",
        "datePublished": "{{date}}",
        "name": "{{desc}}",
        "reviewBody": "{{say}}",
        "reviewRating": {
      "@type": "Rating",
      "ratingValue": "{{customValue}}"        
    }]
  }

  var script = document.createElement('script');
  script.type = "application/ld+json";
  script.innerHTML = JSON.stringify(data);
  document.getElementsByTagName('head')[0].appendChild(script);
})(document);
</script>

遗憾的是,在测试之后,我无法让 JSON-LD 的评论部分以统一的方式重复。事实上,我无法对 JSON 进行超过一次的审查,而且我的代码和 GTM 设置显然有问题。

然后使用带有 CSS 选择器的 DOM 元素在 Google TAG 管理器中设置变量,如下所示:

enter image description here

有时页面上会出现多个评论,因此我需要在 JSON 中输入多个条目,我当前的代码最多只输出一个。

问题是,如果页面上存在多个产品评论,我如何让 GTM 在 JSON-LD 中添加另一条评论?

最佳答案

您可以使用自定义 JavaScript 变量来存储值数组,然后将这些数组的元素设置为 JSON-LD 中的值。

例如,要获取 H1 标签的文本,您可以使用此函数创建自定义 JavaScript 变量:

function () {return document.querySelector('h1').innerText;}

假设您将此变量命名为 h1。然后您可以在 JSON-LD 中将此变量用作 {{h1}}。

JSON-LD 代码可以存储在自定义 HTML 标签中,并填充上述变量。

如果页面上有多个 H1,则可以使用此变量:

function () {return  document.querySelectorAll('h1');}

它将返回一个元素数组,您可以遍历此数组以获取 innerText 或只查看每个元素,例如:

{{h1}}[0].innerText

让我在此博文示例中展示我的想法 - https://netpeak.net/blog/modify-your-ppc-strategy-to-suit-voice-search/ .您可以像这样从页面获取所有 H2 header (或评论或任何内容):

var allh2 = document.querySelectorAll('h2');

就 GTM 而言,它可以是自定义 JavaScript 变量,或者您可以只使用 JSON-LD 构建一个自定义 HTML 标签。接下来,您创建空数组来存储这些 header 的内部文本,并将所有值作为 JSON-LD 表示法中的对象推送:

var reviews = [];
for(i = 0; i < allh2.length; i ++){ 
  reviews.push({'review':allh2[i].innerText});
}

现在您有 reviews 变量,可以用作“reviews”键的 JSON-LD 标记中的值。

关于javascript - 如何将 Google 标签管理器与使用 JSON-LD 和变量的多模式产品评论结合使用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43708015/

相关文章:

schema - 如何将多个 biztalk 应用程序引用的通用模式组织在同一个组中?

元素以任意顺序出现任意次数的 xml 架构构造

javascript - 为每个唯一日期获取数据的第一个值到数组中

javascript - 如何将动态 URL 添加到制表单元格?

javascript - 如何在 html 中制作幻灯片横幅?

javascript - 使用 JQuery 访问按钮值

javascript - 隐藏4个div;点击后单独换出

javascript - 如何在 jQuery 中缓存 DOM 变量

html - 带侧边栏的 Bootstrap 3 流体布局防止垂直滚动

Oracle:根据角色更改架构