HubSpot ve GTM - Form Etkinliklerini İzleme İşlemi

Hubspot ile ilgili izleme işlemlerinde daha önce, Hubspot izleme kodu ve ardından Google Analytics, Google Tag Manager ve Adroll entegrasyonlarına ve bu süreçte dikkat edilmesi gereken hususlara değinmiştim.

AA

İlgili detaylara HubSpot İzleme Kodu (Tracking Code) İşlemleri ve HubSpot GA, GTM, Adroll Tracking İşlemleri sayfaları üzerinden ulaşabilirsiniz. Yazılar ilerledikçe konuyu biraz daha spesifik bir boyuta indirgemeye devam edeceğim.

Bu yazı bağlamında odaklanacağımız konu artık Sayfalar (Pages) yerine sayfalar içerisinde kullandığımız formlar ile ilgili etkinlikler olacak. Özetle, yazının kalan bölümünde Hubspot üzerinden oluşturduğumuz formları Marketing > Lead Capture > Forms Google Tag Manager ve/veya Google Analytics ile (ya da diğer izleme araçları ile) nasıl takip edebileceğimize değineceğim1.

HubSpot Forms

Hubspot, oldukça kolay bir şekilde hem kendi içerisinde Sayfalar (Pages) ile kullanılmak üzere hem de Hubspot dışında (non-HubSpot forms) kullanılmak üzere form oluşturma ve yönetme imkanı sunmakta. Oluşturulan her form kolay bir şekilde HubSpot Sayfalar (Webpages, blog, landing page) içerisine yerleştirilebilmekte. Diğer yandan, bu formları HubSpot dışında da URL ve JS embed seçenekleri ile kullanma imkanı söz konusu2.

Formlar oluşturulduktan ve herhangi bir sayfa ile ilişkilendirildikten sonra HubSpot tarafından takip edilmekte ve Görüntüleme (View), Gönderim Oranı (Submission Rate), Gönderim Sayısı (Submissions), Yer Aldığı Sayfa Sayısı (Appers On), Son Güncelleme (Last Modified) gibi bilgilerle birlikte listelenmekte. Buna ek olarak, ilgili form başlığını tıkladığınızda o form özelinde Hubspot tarafından derlenen bilgilerin yer aldığı oldukça kapsamlı raporlara da ulaşabilmektesiniz3 4.

Şimdi bir LP örneği üzerinden ilk olarak HubSpot içerisinde form izleme işlemlerini detaylandıralım.

HubSpot Form Traking

HubSpot oluşturulan her form için benzersiz bir ID tanımı oluşturur. Bu sayede ilgili formla ilgili detayları görebilir ve formları optimize edebiliriz. Ek olarak, oluşturulan bu ID sayesinde, ilgili formları Pages tanımları (blog, landing page, website) içerisine kolayıkla yerleştirebiliriz. Marketing > Website > Landing Pages seçeneği üzerinden ilerleyelim ve oluşturduğumuz bir formu ilgili varış sayfası içerisinde kullanalım.

Create > Landing Page adımlarını izleyerek yeni bir LP oluşturabilir ya da var olan bir LP tanımını tıklayarak ilerleyebiliriz.

Yeni bir şablon seçsek de, var olan bir seçim üzerinden ilerlesek de bir sonraki aşamamız elbette Edit (Düzenle) sayfası olacaktır.

Modules (Modüller) bölümünde form seçeneğini görebilirsiniz. Form modülü tıklandığında, kullanılabilir durumdaki tüm formların Choose a form bölümünde listelendiğini görebilirsiniz. Form seçiminin ardından, formun barındırdığı alanlar (input) ekranımızda belirecektir. Bir sonraki aşamamız formun yerleştirilmesini istediğimiz alana modülün sürüklenip bırakılması (drag/drop). Artık varış sayfamız kullanıma hazır. Peki, form gönderimlerini GTM ile nasıl takip edebileceğiz?

HubSpot formları gönderim aşamasında 2 seçenek üzerinden ilerler;

  • Redirect to another page (başka bir sayfaya yönlendir)
  • Display an inline thank you message (sayfa içerisinde teşekkürler mesajı görüntüle)

HubSpot GA, GTM, Adroll Tracking İşlemleri başlıklı yazımda da belirttiğim üzere, Settings > Pages bölümündeki tüm değişiklikler biz aksini belirtmediğimiz (domain seçimine bağlı olarak) sürece tüm Pages (website, landing page, blog) seçeneklerine uygulanır. Dolayısıyla, biz ilgili bölümde GTM, GA ve/veya Adroll seçeneklerini seçtiysek, hatta Templates altından header ya da footer eklemeleri yaptıysak, o eklemeler oluşturduğumuz bu varış sayfalarına da uygulanacaktır.

Forma ait Settings > Advanced options > Additional code snippets altından da header ve footer alanlarına kod eklemesi yapabiliriz. Bu alana yapacağımız ekleme Settings > Pages eklemesinden sonra işleme alınır. Yani, ilgili ekleem head eklemesi </head>, footer eklemesi de </body> etiketinin hemen öncesine eklenir.

Eğer Redirect to another page seçeneğini seçersek yönlendirilecek URL üzerinden (örneğin bir teşekkürler sayfası) bir dönüşüm işlemini tetikleyebiliriz. Ancak, bu demek değil ki yine de form etkinliklerini takip edemeyiz.

Display an inline thank you message seçimi üzerinden ilerleyelim.

Hubspot'un izleme işlemlerinde _hsp nesnesini kullandığını belirtmiştim.

Bu nesnenin yanı sıra, form ve chat elemanları ile ilgili durumları da postMessage ile paylaşır.

Bu message değerleri sayesinde formun görüntülenmesi, gönderilmesi gibi pek çok süreci takip edebilmekteyiz. Bizim form başarılı bir şekilde gönderildiğinde yakalayacağımız message değerimiz onFormSubmitted. Şimdi, karar değerlendirmemiz gereken 2 seçenek var; ilgili formu Hubspot header alanı üzerinden mi GTM > Custom HTML ile mi takip edeceğiz? Kararımız her ne olursa olsun kullanmamız gereken kod parçacığı aynı olacaktır 5.

Özel İçerik

HubSpot ve GTM - Form Etkinliklerini İzleme İşlemi