Uporabite jQuery za poslušanje in posredovanje sledenja dogodkom Google Analytics za vsak klik

jQuery Poslušajte za klike za prenos sledenja dogodkom Google Analytics

Presenečen sem, da se več integracij in sistemov ne vključi samodejno Sledenje dogodkom Google Analytics na svojih platformah. Večino mojega časa pri delu na spletnih mestih strank razvijam sledenje za dogodke, da bi stranki zagotovili informacije, ki jih potrebuje o tem, kakšno vedenje uporabnikov deluje ali ne deluje na spletnem mestu.

Pred kratkim sem pisal o tem, kako slediti mailto klikov, tel klikovin Oddaja obrazcev Elementor. Še naprej bom delil rešitve, ki jih pišem, v upanju, da vam bodo pomagale bolje analizirati uspešnost vašega spletnega mesta ali spletne aplikacije.

Ta primer ponuja zelo preprost način za vključitev sledenja dogodkom Google Analytics v katero koli sidrno oznako z dodajanjem podatkovnega elementa, ki vključuje kategorijo dogodka Google Analytics, dejanje dogodka Google Analytics in oznako dogodka Google Analytics. Tukaj je primer povezave, ki vključuje podatkovni element, imenovan dogodek:

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

Predpogoj za vaše spletno mesto je, da vanj vključite jQuery ... s katerim se poganja ta skript. Ko se vaša stran naloži, ta skript na vašo stran doda poslušalca za vsakogar, ki klikne na element dogodek podatki … nato zajame in razčleni kategorijo, dejanje in oznako, ki jo določite v polju.

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

Obvestilo: Vključil sem opozorilo (komentirano), da lahko preverite, kaj je dejansko uspešno.

Če uporabljate jQuery v WordPressu, boste želeli kodo le malo spremeniti, saj WordPress ne ceni bližnjice $:

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

To ni najbolj robusten skript in morda boste morali opraviti nekaj dodatnega čiščenja, vendar bi morali začeti!