Brûk jQuery om te harkjen en troch te jaan Google Analytics Event Tracking foar elke klik

jQuery Harkje nei klikken om Google Analytics Event Tracking troch te jaan

Ik bin fernuvere dat mear yntegraasjes en systemen net automatysk omfetsje Google Analytics Event Tracking yn harren platfoarms. In protte fan myn tiid wurkjen oan 'e siden fan kliïnten is it ûntwikkeljen fan tracking foar Events om de kliïnt de ynformaasje te jaan dy't se nedich binne oer hokker brûkersgedrach wurket of net wurket op' e side.

Meast resint, ik skreau oer hoe te folgjen mailto klikken, tel kliks, en Elementor formulier yntsjinjen. Ik sil trochgean mei it dielen fan de oplossingen dy't ik skriuw mei de hoop dat it jo helpt om jo prestaasje fan jo side of webapplikaasje better te analysearjen.

Dit foarbyld jout in heul ienfâldich middel foar it opnimmen fan Google Analytics Event Tracking yn elke ankertag troch it tafoegjen fan in gegevenselemint dat de Google Analytics Event Category, Google Analytics Event Action, en Google Analytics Event Label omfettet. Hjir is in foarbyld fan in keppeling dy't it gegevenselemint omfettet, neamd gaevent:

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

In betingst foar jo side is it opnimmen fan jQuery deryn ... wêrmei dit skript wurdt oandreaun. Sadree't jo side is laden, dit skript foeget in harker oan jo side foar elkenien dy't klikt op in elemint mei gaevent gegevens ... dan vangt en parseart it de kategory, aksje en label dy't jo opjaan binnen it fjild.

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

Opmerking: ik haw in warskôging opnommen (kommentaarde) sadat jo kinne testen wat der eins trochjûn is.

As jo ​​​​jQuery op WordPress útfiere, wolle jo de koade mar in bytsje wizigje, om't WordPress de fluchtoets $ net wurdearret:

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

It is net it meast robúste skript en jo moatte miskien wat ekstra skjinmeitsjen dwaan, mar it soe jo moatte begjinne!