Hotjar Kullanım Rehberi
Hotjar ile ilgili yayınladığım, giriş niteliğindeki temel bilgilendirme ve biraz daha detaylandırdığım özelliklere odaklanan yazıların ardından son yazı ile akışı sonlandırmak istiyorum.
Bir sonraki aşamada planlım örnek-olaylar ile ilgili çözümleme süreçleri olacak. Şimdi, hızlı bir şekilde yayınlanan bu içerikleri hatırlayalım;
Elbette bu yazılarda genel konulara odaklanmıştım. Süreç içerisinde yayınlanan teknik içerikli yazılar ise şöyle;
Bu yazıda genel olarak yukarıdaki yazıları özetleyecek, ardından Entegrasyonar ve Identify API başlıklarıyla devam edeceğim. Yukarıda bahsi gçen yazılar da dahil olmak üzere Hotjar ile ilgili yayınlanan tüm yazıları görüntülemek isterseniz Hotjar etiketini takip edebilirsiniz.
Hotjar ve Kullanıcı Etkinlikleri
Hotjar Nedir? Nasıl Kullanılır? başlıklı yazıda da belirtildiği üzere Hotjar website ısı haritası ve kullanıcı davranış analitiği aracıdır.
Hotjar ve benzeri araçlar sayesinde websitemizi veya web uygulamamızı görüntülen ziyaretçilerin oturum süresince sayfa temelinde gerçekleştirdikleri etkinlikleri (mouse, scroll, klavye etkinlikleri) takip edebilir, formlarımızın etkileşim yoğunluklarını çıkarabilir ve belirli işlem adımlarını analiz edebilmek adına funnel'ler, anketler ve geri bildirim alanları oluşturabiliriz.
Hotjar ile ilgili desteğe mi ihtiyacın var? Tema ve diğer geliştirme işlemleri ile ilgili destek talebinde bulunabilirsin.
Entegrasyonlar
Tüm bu özellikler doğrultusunda sayfa tasarımları ve içerikleri optimize etmemiz mümkün hale gelmektedir. Ancak, Hotjar analiz sürecinin tamamını kapsamaz, bu sürecin içerisindeki önemli araçlardan biridir. Bu sebeple, A/B/n Testing servisleri ve bildirimler için çeşitli entegrasyonlar sunar. Google Optimize1, Optimizely2 ve HubSpot3 sunulan entegrasyonlardan bazıları4.
Hotjar, ürün yol haritasında (product roadmap) da açık bir şekilde belirttikleri üzere özellikler çerçevesinde API kitaplığını büyütmek amacıyla pek çok geliştirme yapmakta5. Her üç ayda bir Hotjar ürün ekibi bir sonraki adımda ne yapılacağını gözden geçirir, plana ekler ve öncelikleri belirler. Bu akış içeriisnde, şu anda mevcut Hotjar API çatısı altında Identify API yer almakta6.
Identify API
Identify API, Kullanıcı özellikleri veya diğer bir ifade ile öznitelikleri (user attributes), web sitesini veya uygulamasını görüntüleyen kullanıcıların ticari olarak değer olarak nitelendirilebilecek davranışlarının takip edilmesi ve bu verilerin analiz sürecine dahil edilmesini sağlar. Identify API aracılığı ile ziyaretçileriniz arasından müşterilerinizi ayıklayabilir (filtreleme) ve bu sayede sunduğunuz hizmete dair daha net bilgilere ulaşabilirsiniz.
Bu işlemin gerçekleştirilebilmesi için standart kurulum koduna eklemeler yapmamız gerekir.
<!-- Hotjar Tracking Code for https://ceaksan.com -->
<script>
// standart kurulum kodu
(function(h,o,t,j,a,r){
h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
h._hjSettings={hjid:<your_user_id>,hjsv:6};
a=o.getElementsByTagName('head')[0];
r=o.createElement('script');r.async=1;
r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
a.appendChild(r);
})(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');
// Identify API tanımları
var userId = <your_user_id> || null;
window.hj('identify', userId, {
// özelleştirilmiş veri alanları burada tanımlanır.
'Signed up': '2019—06-20Z', // Üyelik tarihi (ISO-8601 formatında)
'Last purchase category': 'Electronics', // Son satın alınan ürünün bulunduğu kategori
'Total purchases': 15, // Toplam satın alımlar
'Last purchase date': '2019-06-20Z', // Son satın alım tarihi (ISO-8601 formatında)
'Last refund date': null, // Son yapılan geri iade işlemi tarihi (ISO-8601 formatında)
});
</script>
Yukarıdaki kod örneğinde, standart kurulum kodunun ardından yapılan Identify API tanımlarını görebilirsiniz. Bu tanımlar örnek niteliğinde farklı veri türlerini de belirtecek şekilde eklenmişlerdir. Şayet kurulumu Google Tag Manager üzerinden yaptıysanız, yukarıdaki ve benzeri tanımları Custom JavaScript olarak eklemeniz gerekecektir. Elbette bu özelliği aktifleştirmeden önce kullanıcılarınızı bilgilendirmenizi öneririm.
hj('identify', <userId>, {
'user_attribute': 'value'
});
Kod düzenlenmesi ve ardından Hotjar panelden özelliğin aktif hale getirilmesi (Enable User Attributes) ile birlikte artık kullanıcı tanımları seçilebilir, filtrelenebilir ve hedeflenebilri hale gelecektir7. Örneğin, websiteniz üzerinden belirli bir miktarın veya adedin üzerinde alışveriş yapmış kullanıcılar arasından son 30 gün içerisinde ankete katılanları filtreleyebilir ve verdikleri cevapları analiz sürecinde değerlendirebilirsiniz8.
Peki, User ID nasıl işliyor?
Yukarıdaki <userId>
alanı kullanıcımıza ait ve benzersiz bir değeri temsil ediyor. Eğer kullanıcı tanımlayıcı bir etkinlik gerçekleştirmişse (örneğin, üye girişi) bu veri çoğunlukla veritabanı üzerinden çağırılacaktır. Ancak, kullanıcının oturum başlatmadığı durumlar da olabilir ya da kullanıcı farklı cihazlar üzerinden işlemler gerçekleştiriyor olabilir. Örnek bir durumu ele alalım.
- *#1
- Bir kullanıcımız web sitemizi bilgisayarı aracılığı ile ziyaret etmekte. Kullanıcı girişi yapılmamış olsun, dolayısıyla kullanıcıyı veritabanımızdaki kullanıcılardan biri ile eşleştirmesi gerçekleştiremiyoruz. Bu ziyarete
Session A
diyelim. Hotjar Session A'yı başlatan kullanıcıya kendisi benzersiz bir değer atar. Atadığı değerin123
olduğunu varsayalım9. - *#2
- Web sitemize mobil cihazı ile erişen bir kullanıcı var, herhangi bir oturum gerçekleştirmiyor. Bu nedenle kullanıcı kayıtlarımız ile ilişkilendiremiyoruz. Bu ziyarete de
Session B
diyelim. Hotjar bu kullanıcıya456
değerini versin. - *#3
- Web sitemizi ziyaret eden bir kullanıcı (
Session C
olsun ve Hotjar tarafından789
değeri atansın) bir süre sonra sitemize kullanıcı girişi yapıyor. Giriş bilgileri üzerinden bu kullanıcının John olduğu veAB1
kullanıcı ID'sine sahip olduğunu Hotjar'a ilettiğimizde Hotjar cihaz üzeerinden456
değerine sahip kullanıcınınSession B
oturumunu bu kullanıcı ile ilişkilendirir. Dolayısıyla, John'un mobil cihazı vasıtasıyla önceden gerçekleştirdiği işlemlere de artık ulaşabiliriz. John, bilgisayarı üzerinden de kullanıcı girişi yaptığındaSession A
etkinlikleri de hesabı ile ilişkilendirilecektir.
Veri Tipleri
user_attribute
(key) ve value
için uyulması gereken bazı kurallar bulunmaktadır. Öncelikle, ilk parametre, yani user_attribute
net bir ifade olmalıdır. value
ise aşağıdaki tabloda belirtilen durumlara göre değer alabiir.
Tip | Değer | Sınırlamalar/Notlar |
---|---|---|
Number | Tam veya ondalık sayılar | Minimum -9223372036854775808, maksimum 9223372036854775808 değerini alabilir. |
String | Metin | Maksimum 200 karakter alabilir. Büyük/küçük harfe duyarlı değildir. UTF-8 karakter setini destekler. E-posta tanımı değer olarak verilmemelidir. |
Date | ISO-8601 formatı |
|
Boolean | true veya false |
|
Sadece email key'i ile e-posta adresi iletilebilir. Farklı bir string parametre ile iletilen e-posta adresi reddedilir. |
E-posta adresi ile ilgili bir diğer husus da şudur. User ID olarak e-posta adresinin kullanıldığı durumlar olabilir.
hj('identify', <userId>, {
'user_attribute': 'value'
});
Bu gibi durumlarda <userId>
alanında bu e-posta adresinin belirtilmesi gerekir. Ancak bu kullanım son çare olarak değerlendirilmelidir. Çünkü kullanıcı e-posta adresini değiştirebilir. Bu durumda farklı adresler farklı etkinlikler ile ilişkilendirilecektir.
Anonim Kullanıcılar
Kullanıcı etkinliklerini sadece kayıtlı kullanıcılar ile ilişkilendirmek istemeyeceğimiz durumlar söz konusu olabilir. Örneğin, yaptığımız bir a/b testini tüm kullanıcılar üzerinden değerlendirmek isteyebiliriz. Bu durumda, eşleştirilmemiş kullanıcılar için <userId>
için null
değerini verebiliriz10.
hj('identify', null, {
ab_test: 'variant-A',
referrer: 'facebook_paid'
});
- Using Hotjar with Google Optimize ↩
- Integrate Optimizely with Hotjar ↩
- [HubSpot Connect] - Hotjar Integration ↩
- Hubspot Integrations ↩
- Hotjar Public Product Roadmap ↩
- Hotjar API ↩
- How to Setup User Attributes in 4 Steps ↩
- How To Use User Attributes to Target Surveys and Incoming Feedback ↩
- What is a Hotjar User ID? ↩
- Identify API Reference ↩