Benotzt jQuery fir ze lauschteren a passéieren Google Analytics Event Tracking fir all Klick

jQuery Lauschtert no Klicks fir Google Analytics Event Tracking ze passéieren

Ech sinn iwwerrascht datt méi Integratiounen a Systemer net automatesch enthalen Google Analytics Event Tracking an hire Plattformen. Vill vu menger Zäit, déi op de Site vun de Clienten schaffen, entwéckelt Tracking fir Eventer fir dem Client d'Informatioun ze ginn, déi se brauchen iwwer wéi eng Benotzerverhalen funktionnéieren oder net um Site funktionnéieren.

Zënter kuerzem hunn ech geschriwwen iwwer wéi ech verfollegen mailto klickt, Tel klickt, an Elementor Form Soumissioun. Ech wäert weider d'Léisungen deelen, déi ech schreiwen, mat der Hoffnung datt et Iech hëlleft Är Site oder Webapplikatiouns Leeschtung besser ze analyséieren.

Dëst Beispill bitt e ganz einfache Mëttel fir Google Analytics Event Tracking an all Ankertag z'integréieren andeems en Dateelement bäidréit deen d'Google Analytics Event Category, Google Analytics Event Action a Google Analytics Event Label enthält. Hei ass e Beispill vun engem Link deen den Dateelement integréiert, genannt gaevent:

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

Eng Viraussetzung fir Äre Site ass jQuery dran abegraff ... mat deem dëst Skript ugedriwwe gëtt. Wann Är Säit gelueden ass, füügt dëst Skript en Nolauschterer op Är Säit fir jiddereen deen op en Element klickt gaevent Daten ... dann erfaasst a parséiert d'Kategorie, d'Aktioun an d'Label déi Dir am Feld spezifizéiert.

<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>

Opgepasst: Ech hunn eng Alarm abegraff (kommentéiert) fir datt Dir kënnt testen wat tatsächlech passéiert ass.

Wann Dir jQuery op WordPress leeft, wëllt Dir de Code just e bëssen änneren, well WordPress d'$ Ofkiirzung net schätzt:

<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>

Et ass net dee robustste Skript an Dir musst vläicht e puer zousätzlech Botzen maachen, awer et sollt Iech ufänken!