GoogleタグMagerを使用して要素のインプレッションをトラッキングするにはどうすればよいですか？

Question

特定の要素にインプレッションがある場合、どのようにGTM経由でトラッキングできますか？この要素が何回見られたか知りたいとします。 <div class="box"><div> class"text"><span>Text</span</div</div>

Answer 1

カスタムJavaScript変数を作成して、.boxクラスの要素が存在するかどうかを確認できます。以下のような

何か：

if(document.getElementsByClassName("box")){ 
    return true; 
} else { 
    return false; 
} 

あなたは、あなたのトリガーでこれを使用することができます（たとえば、カスタム変数>が等しい>真。）。

Answer 2

カスタムHTMLタグとカスタムイベントトリガーでインプレッションをトラッキングすることができます。あなたは、要素がページに表示されているかどうかを確認する機能にイベントリスナーをアタッチする必要があります：あなたにそこから

<script> 
 
    var hasDeals = document.getElementsByClassName('box').length; 
 
    var element = document.getElementsByClassName('box')[0]; 
 
    var elVisible = false; 
 
    var eventPushed = false; 
 
     
 
    if(hasDeals>0) { 
 
    \t document.addEventListener("scroll", function() {{isScrolledIntoView(element);}}); 
 
    } 
 
     
 
    function isScrolledIntoView(el) { 
 
    \t if(!elVisible) { 
 
      var elemTop = el.getBoundingClientRect().top; 
 
      var elemBottom = el.getBoundingClientRect().bottom; 
 
      var isVisible = (elemTop >= 0) && (elemBottom <= window.innerHeight); 
 
      elVisible = isVisible; 
 
      return isVisible; 
 
     } else if(!eventPushed) { 
 
      dataLayer.push({'event': 'dealVisible'}); 
 
      eventPushed = true; 
 
     } 
 
    } 
 
</script>

だけトリガーを作成し、あなたが望むようにそれを使用する必要があります。 このスクリプトが動作し、ここでは他のシナリオのためにそれを編集する方法方法についての詳細な説明を見つけることができます：Tracking Elements Impression with Google Tag Manager