JQuery Kullanarak Google Analytics Etkinliklerinde Elementor Form Gönderimleri Nasıl İzlenir?
Son birkaç haftadır oldukça karmaşık olan bir istemci WordPress sitesinde çalışıyorum. Kullanıyorlar WordPress entegrasyonu ile ActiveCampaign potansiyel müşterileri beslemek ve bir Zapier entegrasyon Zendesk Satmak üzerinden Elementor Formları. Harika bir sistem… Bilgi isteyenlere damla kampanyaları başlatmak ve istendiğinde uygun satış temsilcisine yönlendirmek. Elementor'un form esnekliğinden ve görünümünden gerçekten çok etkilendim.
Son adım, müşteriye form gönderimlerinde aydan aya performans sağlayan Google Analytics aracılığıyla bir analiz panosu sağlamaktı. Google Etiket Yöneticisi yüklü, bu nedenle sitedeki e-ticaret işlemlerini ve YouTube görüntüleme etkinliğini zaten yakalıyoruz.
Elementor için başarılı form gönderimini yakalamak için Google Etiket Yöneticisi içindeki DOM, tetikleyiciler ve olayları kullanmak için birkaç girişimde bulundum, ancak hiç şansım olmadı. AJAX aracılığıyla açılacak olan başarı mesajını izleyerek sayfayı izlemenin bir ton farklı yolunu test ettim ve işe yaramadı. Yani… Biraz araştırma yaptım ve Tracking Chef'den harika bir çözüm buldum. GTM ile kurşun geçirmez Elementor form takibi.
Komut dosyası kullanır jQuery ve itmek için Google Etiket Yöneticisi Google Analytics Etkinliği Form başarıyla gönderildiğinde. Bazı küçük düzenlemeler ve bir sözdizimi iyileştirmesi ile ihtiyacım olan her şeye sahiptim. İşte kod:
<script>
jQuery(document).ready(function($) {
$(document).on('submit_success', function(evt) {
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
'event': 'ga_event',
'eventCategory': 'Form ',
'eventAction': evt.target.name,
'eventLabel': 'Submission'
});
});
});
</script>
Başarılı teslimi izlemek, sonra geçmek oldukça zekice form kategori olarak, hedef adı Eylem olarak ve Sunuş etiket olarak. Hedefi programlı hale getirerek, bir form gönderimini gözlemlemek için bu kodu her sayfanın altbilgisine kolayca yerleştirebilirsiniz. Yani… formları eklerken veya değiştirirken, komut dosyasını güncelleme veya başka bir sayfaya ekleme konusunda asla endişelenmenize gerek kalmaz.
Komut Dosyasını Elementor Özel Koduyla Yükleyin
Bir ajanssanız, tüm müşterileriniz için sınırsız yükseltmeyi ve Elementor'u kullanmanızı şiddetle tavsiye ederim. Sağlam bir platform ve iş ortağı entegrasyonlarının sayısı hızla artmaya devam ediyor. Gibi bir Eklenti ile birleştirin İletişim Formu DB ve ayrıca tüm form gönderimlerinizi de toplayabilirsiniz.
Elementor Pro yerleşik harika bir komut dosyası yönetimi seçeneğine sahiptir. Kodunuzu şu şekilde girebilirsiniz:
- Şu yöne rotayı ayarla Elementor > Özel Kod
- Kodunuzu adlandırın
- Konumu ayarlayın, bu durumda son vücut etiketi.
- Eklemek istediğiniz birden fazla komut dosyanız varsa bir öncelik belirleyin ve bunların sırasını belirleyin.
- Güncelle'yi tıklayın
- Sizden koşulu ayarlamanız ve tüm sayfaların varsayılanına ayarlamanız istenecektir.
- Önbelleğinizi yenileyin ve betiğiniz yayında!
Google Etiket Yöneticisi Entegrasyonunuzu Önizleyin
Google Etiket Yöneticisi, bir tarayıcı örneğine bağlanmak ve değişkenlerin düzgün gönderilip gönderilmediğini gözlemlemek için kodunuzu gerçekten test etmek için harika bir mekanizmaya sahiptir. Google Analytics gerçek zamanlı olmadığı için bu önemlidir. Bunu fark etmediyseniz, test edebilir, test edebilir ve test edebilir ve verilerin Google Analytics'te görünmediği için gerçekten hayal kırıklığına uğrayabilirsiniz.
Burada nasıl yapılacağına dair bir eğitim vermeyeceğim. Google Etiket Yöneticisi'ni önizleyin ve hata ayıklayın… Bildiğinizi varsayacağım. Formumu bağlı test sayfamda gönderebilir ve GTM verilerine aktarılan verileri olması gerektiği gibi görebilirim:
Bu durumda, kategori Form olarak sabit kodlanmıştır, hedef Bize Ulaşın formudur ve etiket Gönderimdir.
Google Etiket Yöneticisi'nde Veri Değişkenlerini, Olayı, Tetikleyiciyi ve Etiketi Ayarlayın
Bu konudaki son adım, bu değişkenleri yakalamak ve bunları bir etkinlik için ayarlanmış bir Google Analytics Etiketine göndermek için Google Etiket Yöneticisi'ni kurmaktır. Elad Levy bu adımları diğer gönderisinde detaylandırıyor: Google Etiket Yöneticisinde Genel Etkinlik İzleme.
Bunlar ayarlandıktan sonra Etkinlikleri Google Analytics'te görebileceksiniz!
Açıklama: Bu makale boyunca bağlı kuruluş bağlantılarımı kullanıyorum.