AMP sayfalarınız için temel analiz nasıl yapılandırılır?
Analytics platformları, genellikle, analiz sistemine geri gönderilen olayları tetikleyen satır içi JavaScript parçacıkları ve işlev çağrıları aracılığıyla web sitelerine entegre edilir. AMP, bu süreci birkaç analiz iş ortağı için çoğaltmak için esnek bir JSON yapılandırma sözdizimi sağlar.
amp-analytics öğrenin. Bağlam için: AMP olmayan sayfalarda analiz
Aşağıda, geleneksel JavaScript tabanlı Google Analytics izleme örneği verilmiştir. Bunu amp-analytics JSON biçiminde yeniden yazacağız, ancak önce geleneksel yaklaşıma bakalım:
<script>
(function (i, s, o, g, r, a, m) {
i['GoogleAnalyticsObject'] = r;
(i[r] =
i[r] ||
function () {
(i[r].q = i[r].q || []).push(arguments);
}),
(i[r].l = 1 * new Date());
(a = s.createElement(o)), (m = s.getElementsByTagName(o)[0]);
a.async = 1;
a.src = g;
m.parentNode.insertBefore(a, m);
})(
window,
document,
'script',
'//www.google-analytics.com/analytics.js',
'ga'
);
ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
</script>
Bu JavaScript oldukça basittir; pageview olayını izlemek için bir bildirim gönderir.
1. Adım: amp-analytics komut dosyasını dahil edin
Bu işlevi AMP'de çoğaltmak için önceamp-analytics bileşen kitaplığını belgemizin <head> bölümüne eklemeliyiz:
<script
async
custom-element="amp-analytics"
src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"
></script>
2. Adım: Yapılandırma kodunu ekleyin
Ardından, amp-analytics bileşenini belgenin body bölümünün sonuna ekleyelim:
<amp-analytics type="googleanalytics">
<script type="application/json">
{
"vars": {
"account": "UA-YYYY-Y"
},
"triggers": {
"default pageview": {
"on": "visible",
"request": "pageview",
"vars": {
"title": "Name of the Article"
}
}
}
}
</script>
</amp-analytics>
Bu sayfanın üst kısmındaki JavaScript örneğinde olduğu gibi, bu amp-analytics parçacığı, Google Analytics'e bir sayfanın görüntülendiğini belirten bir bildirim gönderecektir.
Bunu belirtmek için, type googleanalytics olarak ayarladık ve ardından JSON'da "default pageview" adını verdiğimiz bir tetikleyici oluşturduk. Bu tetikleyici, sayfa görünür olduğunda ("on": "visible" nedeniyle) tetiklenecek ve tetiklendiğinde, vars ile belirttiğimiz değişkenlerle Google Analytics'e birpageview analizi isteği göndereceğiz.
amp-analytics'i yapılandırmak için kullanılan JSON, hangi analitik verilerin gönderileceğini ve ne zaman gönderileceğini açıklamak için çok esnek bir formattır. amp-analytics, formatla ilgili tüm ayrıntılara sahiptir.
3. Adım: Daha fazla tetikleyici ekleyin
Yukarıdaki örneğe dayanarak, "click on #header trigger" adlı başka bir tetikleyici ekleyebiliriz:
<amp-analytics type="googleanalytics">
<script type="application/json">
{
"vars": {
"account": "UA-YYYY-Y"
},
"triggers": {
"default pageview": {
"on": "visible",
"request": "pageview",
"vars": {
"title": "Name of the Article"
}
},
"click on #header trigger": {
"on": "click",
"selector": "#header",
"request": "event",
"vars": {
"eventCategory": "examples",
"eventAction": "clicked-header"
}
}
}
}
</script>
</amp-analytics>
Bu yeni tetikleyicinin adından da tahmin edebileceğiniz gibi, "header" kimliğine sahip öğe tıklandığında tetiklenecektir ("on": "click" ve "selector": "#header"" ile belirtilir). Bu tetikleyici etkinleştiğinde, isteğe dahil edilecek birkaç değişkeni belirterek event isteğini analitik sağlayıcımıza göndereceğiz.
Entegre etmek istediğiniz özel bir izleme platformunuz varsa, amp-analytics'i kullanabilir ve izleme verilerini göndermek için kendi kişiselleştirilmiş URL uç noktalarınızı tanımlayabilirsiniz. amp-analytics bileşen referans belgelerinde daha fazla bilgi edinin.
“UA-YYYY-Y”, örnek bir Google Analytics hesabıdır. Sitenizde bu örneği kullanıyorsanız, kendi web sitenizin Google Analytics izleme koduyla değiştirilmelidir.
amp-pixel'e bir göz atmak isteyebilirsiniz. Yalnızca sayfa görüntülemelerini izlemeniz gerekiyorsa, amp-pixelamp-analytics'ten daha hafif bir çözümdür, çünkü yalnızca geleneksel piksel izlemenin gereksinimlerini çözmeyi amaçlamaktadır. Analytics'te daha fazla bilgi edinin:Analytics: temel bilgiler kılavuzu.