AMPリスト要素分析

Question

<amp-list class="mx1 md-mxn1" [src]="'api/' + products.filter + '-' + products.category + '-products.json'" src="some.json" height="1000" width="300" layout="responsive"> 
    <template type="amp-mustache"> 
     <a href="{{ Url }}" target="_self" id="commerce-listing-product" class="commerce-listing-product text-decoration-none inline-block col-6 md-col-4 lg-col-3 px1 mb2 md-mb4 relative"> 
     <div class="flex flex-column justify-between"> 
      <div> 
      <amp-img class="commerce-listing-product-image mb2" src="{{ imageUrl }}" width="340" height="340" layout="responsive" alt="{{ name }}" noloading=""></amp-img> 
      <h2 class="commerce-listing-product-name h6">{{ productName }}</h2> 
      </div> 
      </div> 
     </a> 
    </template> 
    </amp-list> 

私はタグのクリックで分析を追跡したいです。私はIDを使ってそれを追跡しています。 私はどの製品がクリックされたのかを追跡し、製品名をeventLabelとしてGoogleアナリティクスに渡したいと考えています。どうすればこれを達成できますか？

Answer 1

申し訳ありませんが、私は明らかにトピックに関するAMPを逃しました。

この従ってください：これを使用します）（身体に）

<amp-analytics type="googleanalytics" id="analytics1"> 
    ... 
</amp-analytics> 

3：

1）解析を含める：

<script async custom-element="amp-analytics" 
    src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script> 

2）テンプレートを追加しますJSONからイベントトラッキング：

{ 
    "vars": { 
    "account": "UA-XXXXXX-Y" 
    }, 
    "triggers": { 
    "trackClickOnHeader" : { 
     "on": "click", 
     "selector": "#header", 
     "request": "event", 
     "vars": { 
     "eventCategory": "ui-components", 
     "eventAction": "header-click" 
     } 
    } 
    } 
} 

ので完成したコードは、次のようになります（これはそれにあなたの値を追加します。一例に過ぎない）

<amp-analytics type="googleanalytics" id="analytics2"> 
<script type="application/json"> 
{ 
    "vars": { 
    "account": "UA-XXXXXX-Y" 
    }, 
    "triggers": { 
    "trackClickOnHeader" : { 
     "on": "click", 
     "selector": "#commerce-listing-product", 
     "request": "event", 
     "vars": { 
     "eventCategory": "List Element", 
     "eventAction": "Click", 
     "eventLabel": "{{URL}}",   <--- NOT REQUIRED 
     "eventValue": "100millioninionions" <--- NOT REQUIRED 

     } 
    } 
    } 
} 
</script> 
</amp-analytics>