Herhangi Bir Tıklama İçin Google Analytics Etkinlik İzlemeyi Dinlemek ve Geçmek için jQuery Kullanın

jQuery Google Analytics Etkinlik İzlemeyi Geçmek için Tıklamaları Dinleyin

Daha fazla entegrasyon ve sistemin otomatik olarak içermemesine şaşırdım Google Analytics Etkinlik İzleme kendi platformlarında. Müşterilerin sitelerinde çalıştığım zamanımın çoğu, müşteriye sitede hangi kullanıcı davranışlarının işe yarayıp yaramadığı konusunda ihtiyaç duydukları bilgileri sağlamak için Etkinlikler için izleme geliştirmektir.

En son, nasıl izleneceği hakkında yazdım mailto tıklamaları, telefon tıklamaları, ve Elementor form gönderimleri. Sitenizin veya web uygulamanızın performansını daha iyi analiz etmenize yardımcı olması umuduyla yazdığım çözümleri paylaşmaya devam edeceğim.

Bu örnek, Google Analytics Etkinlik Kategorisini, Google Analytics Etkinlik Eylemini ve Google Analytics Etkinlik Etiketini içeren bir veri öğesi ekleyerek Google Analytics Etkinlik İzleme'yi herhangi bir bağlantı etiketine dahil etmenin çok basit bir yolunu sunar. adlı veri öğesini içeren bir bağlantı örneği aşağıda verilmiştir: gaevent:

<a href="#" data-gaevent="Category,Action,Label">Click Here</a>

Siteniz için bir ön koşul, bu betiğin desteklendiği jQuery'yi içermesidir. Sayfanız yüklendikten sonra, bu komut dosyası, bir öğeyi tıklayan herkes için sayfanıza bir dinleyici ekler. gaevent data… ardından alan içinde belirttiğiniz kategoriyi, eylemi ve etiketi yakalar ve ayrıştırır.

<script>
  $(document).ready(function() {      
    $(document).on('click', '[data-gaevent]', function(e) {
      var $link = $(this);
      var csvEventData = $link.data('gaevent');
      var eventParams = csvEventData.split(',');
      if (!eventParams) { return; }
        eventCategory = eventParams[0]
        eventAction = eventParams[1]
        eventLabel = eventParams[2]
        gtag('event',eventAction,{'event_category': eventCategory,'event_label': eventLabel})
        //alert("The Google Analytics Event passed is Action: " + eventAction + ", Category: " + eventCategory + ", Label: " + eventLabel);
    });
  });
</script>

Uyarı: Neyin gerçekten geçtiğini test edebilmeniz için bir uyarı (yorum yapıldı) ekledim.

WordPress'te jQuery kullanıyorsanız, WordPress $ kısayolunu beğenmediğinden kodu biraz değiştirmek isteyeceksiniz:

<script>
  jQuery(document).ready(function() {      
    jQuery(document).on('click', '[data-gaevent]', function(e) {
      var $link = jQuery(this);
      var csvEventData = $link.data('gaevent');
      var eventParams = csvEventData.split(',');
      if (!eventParams) { return; }
        eventCategory = eventParams[0]
        eventAction = eventParams[1]
        eventLabel = eventParams[2]
        gtag('event',eventAction,{'event_category': eventCategory,'event_label': eventLabel})
        //alert("The Google Analytics Event passed is Action: " + eventAction + ", Category: " + eventCategory + ", Label: " + eventLabel);
    });
  });
</script>

En sağlam komut dosyası değil ve bazı ek temizlik yapmanız gerekebilir, ancak başlamanıza yardımcı olmalıdır!