Google Analytics Sanal Sayfa İşlemleri

Sayfa İçi Etkileşimlerin Virtual Pageview Olarak İşlenmesi

Güncelleme Yayın

İletişim sayfası üzerinden aldığım hemen hemen her mesajı cevaplandırmaya, aynı zamanda da not olarak derlemeye özen gösteriyorum. Bu sayede var olan içerikleri güncel tutabiliyor olmanın yanı sıra farkında olmadığım ya da göz ardı ettiğim konuların da farkına varabiliyorum. Özellikle, sürekli gözümüzün önünde olan olan araçlar, ifadeler veya hesaplamalar bir süre sonra biz farkında olmadan bakış açımızı daraltı kendi bağımlılıklarını yaratabiliyor.

Destek

Google Analytics ile ilgili desteğe mi ihtiyacın var? Danışmanlık için destek talebinde bulunabilirsin.

Elbette bu durumda elde ettiğimiz sonuçlara mutlak doğru gözüyle bakabiliyoruz. Google Analytics temelinde aldığım soruların notlarına göz attığımda formüller ve metriklere dair epey bir soru biriktiğini fark ettim. Öncelikle, sayfa (Davranış > Site İçeriği > Tüm Sayfalar) temelinde çeşitli konulara değineceğim. Google Analytics ile ilgili yazı serisinin devamındaki ilk konumuz sanal sayfa görüntüleme (virtual pageview). Benzer bir işlemi Hotjar için anlatmıştım. Alternatif olarak etkinlik (event) kullanımı (özellikle Google Tag Manager ile ilişkili olarak) da ele alınabilir elbette.

Google Analytics

Virtual Pageview

Sayfa görüntüleme (page views), web sitenizdeki veya uygulamadaki (bkz. Single Page Applications) belirli bir sayfa/ekran için sahip olduğumuz görüntüleme sayısı metriğidir ve Google Analytics kurulumunda ön tanımlı olarak işleme alınır. Elbette gtag.js ve analytics.js için teknik farklılıklar söz konusu olacaktır. analytics.js için snippet şu şekilde idi:

<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','https://www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
</script>
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXX-Y"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'UA-XXXXX-Y');
</script>
Google Analytics

Google Analytics Virtual Pageview Kullanımı

Web sitesi temelinde baktığımızda, sayfalar genellikle bir HTML belgesine karşılık gelirler. Ancak, kimi durumda dinamik olarak içeriklere müdahale etmemiz gerekir. Örneğin, modal, popover, slider, onepage checkout process, tab, js/ajax form submit gibi kullanımlarda ve Hedef (Goal) oluşturma aşamalarında da içerikleri işleyebilmekteyiz. Ancak URL path değişikliği olmadığı için Google Analytics bu işlemleri sayfa görüntüleme olarak algılamayacaktır. İşte, bu aşamada, normalde var olmayan ancak dinamik olarak görüntülenen içerikler için sanal sayfa görüntüleme (virtual pageview) özelliğinden faydalanırız. analytics.js yukarıdaki kurulum kodlarında da görüldüğü üzere, pageview etkinliğini kod içerisinde işlenmekte. gtag.js için ise herhangi bir ek tanım gerekmemekte. Her iki durumda da JavaScript etiketi bir izleyici nesne (tracker object) oluşturur ve bunu Google Analytics’e sayfa görüntüleme (hitType: 'pageview') olarak iletir. İletilen veri tarayıcı üzerinden derlenmektedir; Başlık alanı için document.title ve sayfa yolu için document.location sayfa için derlenen öncelikli alanlardır. Aşağıdaki kodlarda ga() analytics.js, gtag() ise global site etiketi kurulumlarını ifade etmektedir.

ga('send', 'pageview', [page], [fieldsObject]);
gtag('config', 'GA_MEASUREMENT_ID', {<pageview_parameters>});

Sanal sayfa görüntüleme işlemi için hitType tanımını yeniden ele alırız ve ilgili etkinlik gerçekleştirildiğinde (form gönderimi, modal görüntüleme vb.) ilgili olayı Google Analytics‘e iletiriz.

ga('send', 'pageview', location.pathname);
ga('send', {
  hitType: 'pageview',
  page: location.pathname,
  title: 'Sayfa Başlığı' // opsiyonel
});

gtag('config', 'UA-XXXXX-Y', {
  'page_title' : 'Sayfa Başlığı', // opsiyonel
  'page_location': 'http://foo.com/your-custom/'+location.pathname, // opsiyonel
  'page_path': location.pathname // opsiyonel
});
Google Analytics

SPA kullanımında, uygulama içeriği dinamik olarak yüklediğinde ve adres çubuğundaki URL’yi güncellediğinde, izleyicide (tracker) depolanan verilerin de güncellenmesi gerekir. Bu güncelleme işlemi için set komutunu kullanarak yeni sayfa değerini (page value) iletiriz.

ga('set', 'page', '/new-page.html');

Yeni sayfa değerini (new page value) tanımlamamızın ardından, gönderilen tüm sonraki isabetler bu yeni değeri kullanacaktır. Bir sayfa görüntüleme (pageview) kaydetmek için izleyiciyi güncellenmesinin hemen ardından sayfa görüntüleme isabeti (pageview hit) gönderilmelidir.

ga('send', 'pageview');

Özetlemek gerekirse, bir sanal sayfa görüntüleme işleminde işlenecek kod şu şekilde olacaktır.

ga('set', 'page', '/new-page.html');
ga('send', 'pageview');

Bu işlemi bir bağlantı tıklaması ile de gerçekleştirebiliriz.

<a href="[dosya-yolu].pdf" onClick="ga('send’, 'pageview', '[dosya-yolu].pdf');">Download PDF File</a>

gtag.js için ise bu işlem app / screen measurement başlığı altında ele alınmaktadır.

gtag('event', 'screen_view', {
  'app_name': 'myAppName',
  'screen_name' : 'Home'
});

İleri Okumalar

Kaynakça