Kullanım Durumları
Bu kılavuzda kullanıcı katılımını izlemek için bir dizi yaygın kullanım durumu verilmiştir:
Bir kullanım durumu eklemek istiyor musunuz? Bize bildirin.
Kendi kullanım durumlarınızla da katkı da bulunabilirsiniz; bkz. Katkı Sağlama.
Sayfa görünümlerini izleme
amp-pixel
ve amp-analytics
kullanarak sayfa görünümlerini nasıl izleyeceğinizi öğrenin.
Amp-pixel kullanma
amp-pixel
kullanarak belli bir URL›ye sayfa görüntüleme verilerini gönderin:
<amp-pixel src="https://foo.com/pixel?"></amp-pixel>
Amp-analytics kullanma - satıcısız
amp-analytics
kullanarak belli bir URL›ye sayfa görüntüleme verilerini gönderin:
<amp-analytics>
<script type="application/json">
{
"requests": {
"pageview": "https://example.com/analytics?url=${canonicalUrl}&title=${title}&acct=${account}"
},
"vars": {
"account": "ABC123"
},
"triggers": {
"trackPageview": {
"on": "visible",
"request": "pageview"
}
}
}
</script>
</amp-analytics>
Amp-analitik kullanma - googleanalytics
Sayfa görüntüleme verilerini Google Analytics›e gönderin (ayrıca bkz. Google Analytics›de sayfa izleme):
<amp-analytics type="googleanalytics" id="analytics1">
<script type="application/json">
{
"vars": {
"account": "UA-XXXXX-Y" // Replace with your property ID.
},
"triggers": {
"trackPageview": { // Trigger names can be any string. trackPageview is not a required name.
"on": "visible",
"request": "pageview"
}
}
}
</script>
</amp-analytics>
Sayfa tıklamalarını izleme
amp-analytics
kullanarak,
etkinlik verilerini
Google Analytics ya da bir URL›ye göndererek sayfa tıklamalarını nasıl izleyeceğinizi öğrenin.
Verileri belli bir URL›ye gönderme
Aşağıdaki örnekte kullanıcı bir bağlantıya her tıkladığında (<a href>
) belirlenen URL›ye bir click
etkinliği göndermek için selector
özelliği kullanılmıştır:
<amp-analytics>
<script type="application/json">
{
"requests": {
"event": "https://example.com/analytics?eid=${eventId}&elab=${eventLabel}&acct=${account}"
},
"vars": {
"account": "ABC123"
},
"triggers": {
"trackAnchorClicks": {
"on": "click",
"selector": "a",
"request": "event",
"vars": {
"eventId": "42",
"eventLabel": "clicked on a link"
}
}
}
}
</script>
</amp-analytics>
Verileri Google Analytics›e gönderme
Aşağıdaki örnekte, özel bir ögeye tıklandığında Google Analytics›e bir click
etkinliği göndermek için trigger
özniteliği için selector
kullanılmıştır (ayrıca bkz.
Google Analytics›de AMP etkinliği izleme):
<amp-analytics type="googleanalytics" id="analytics3">
<script type="application/json">
{
"vars": {
"account": "UA-XXXXX-Y" // Replace with your property ID.
},
"triggers": {
"trackClickOnHeader" : {
"on": "click",
"selector": "#header",
"request": "event",
"vars": {
"eventCategory": "ui-components",
"eventAction": "header-click"
}
}
}
}
</script>
</amp-analytics>
Kaydırmayı izleme
Amp-analitik kullanarak sayfa kaydırmayı izleyin.
Aşağıdaki örnekte, sayfa %25, %50 ve %90 oranında dikey olarak kaydırıldığında, belirlenen URL›ye bir scroll
etkinliği göndermek için scrollspec
özelliği kullanılmıştır:
Etkinlik aynı zamanda sayfa, scroll
genişliğinin %90 oranında yatay olarak
kaydırıldığında da uyarı verir:
<amp-analytics>
<script type="application/json">
{
"requests": {
"event": "https://example.com/analytics?eid=${eventId}&elab=${eventLabel}&acct=${account}"
},
"vars": {
"account": "ABC123"
},
"triggers": {
"scrollPings": {
"on": "scroll",
"scrollSpec": {
"verticalBoundaries": [25, 50, 90],
"horizontalBoundaries": [90]
}
}
}
}
</script>
</amp-analytics>
Sosyal medya etkileşimlerini izleme
Amp-analitik kullanarak, etkinlik verilerini Google Analytics ya da bir URL›ye göndererek sosyal medya etkileşimlerini nasıl izleyeceğinizi öğrenin.
Verileri belli bir URL›ye gönderme
Aşağıdaki örnekte, kullanıcı bir tweet›e (#tweet bağlantısı
) her tıkladığında, belirlenen URL›ye bir click
etkinliği göndermek için selector
özelliği kullanılmıştır:
<amp-analytics>
<script type="application/json">
{
"requests": {
"event": "https://example.com/analytics?eid=${eventId}&elab=${eventLabel}&acct=${account}"
},
"vars": {
"account": "ABC123"
},
"triggers": {
"trackClickOnTwitterLink": {
"on": "click",
"selector": "#tweet-link",
"request": "event",
"vars": {
"eventId": "43",
"eventLabel": "clicked on a tweet link"
}
}
}
}
</script>
</amp-analytics>
Verileri Google Analytics›e gönderme
Aşağıdaki örnekte, özel bir sosyal medya düğmesine tıklandığında, bir etkinlik göndermek için trigger
özelliği için selector
kullanılmıştır (ayrıca bkz.
Google Analytics›de AMP sosyal medya etkileşimlerini izleme):
<amp-analytics type="googleanalytics" id="analytics4">
<script type="application/json">
{
"vars": {
"account": "UA-XXXXX-Y" // Replace with your property ID.
},
"triggers": {
"trackClickOnTwitterLink" : {
"on": "click",
"selector": "#tweet-link",
"request": "social",
"vars": {
"socialNetwork": "twitter",
"socialAction": "tweet",
"socialTarget": "https://www.examplepetstore.com"
}
}
}
}
</script>
</amp-analytics>