Выкарыстоўвайце jQuery для праслухоўвання і перадачы адсочвання падзей Google Analytics для любога кліку

jQuery Слухайце клікі, каб прайсці адсочванне падзей Google Analytics

Я здзіўлены, што больш інтэграцый і сістэм не ўключаюцца аўтаматычна Адсочванне падзей Google Analytics на сваіх платформах. Большую частку майго часу, працуючы на ​​сайтах кліентаў, я займаюся распрацоўкай адсочвання падзей, каб даць кліенту неабходную інфармацыю аб тым, якія паводзіны карыстальнікаў працуюць або не працуюць на сайце.

Зусім нядаўна я пісаў пра тое, як адсочваць пстрычкі mailto, Тэл пстрычкі, і Адпраўка формы Elementor. Я збіраюся працягваць дзяліцца рашэннямі, якія я пішу, у надзеі, што гэта дапаможа вам лепш прааналізаваць прадукцыйнасць вашага сайта або вэб-прыкладання.

Гэты прыклад забяспечвае вельмі просты спосаб уключэння адсочвання падзей Google Analytics у любы анкерны тэг шляхам дадання элемента даных, які ўключае катэгорыю падзей Google Analytics, дзеянне падзей Google Analytics і метку падзеі Google Analytics. Вось прыклад спасылкі, якая ўключае элемент дадзеных, называецца мерапрыемства:

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

Абавязковай умовай для вашага сайта з'яўляецца ўключэнне ў яго jQuery ... які працуе з гэтым скрыптам. Пасля загрузкі вашай старонкі гэты скрыпт дадае на вашу старонку слухача для тых, хто націскае на элемент мерапрыемства даныя... затым ён фіксуе і аналізуе катэгорыю, дзеянне і метку, якія вы задаеце ў полі.

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

Заўвага: я ўключыў абвестку (пракаментаваў), каб вы маглі праверыць, што насамрэч пройдзена.

Калі вы выкарыстоўваеце jQuery на WordPress, вам захочацца крыху змяніць код, бо WordPress не шануе ярлык $:

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

Гэта не самы надзейны скрыпт, і вам, магчыма, спатрэбіцца зрабіць дадатковую ачыстку, але ён павінен дапамагчы вам пачаць!