Χρησιμοποιήστε το jQuery για να ακούσετε και να μεταβιβάσετε την παρακολούθηση συμβάντων του Google Analytics για οποιοδήποτε κλικ

jQuery Ακούστε κλικ για να περάσουν την παρακολούθηση συμβάντων του Google Analytics

Εκπλήσσομαι που περισσότερες ενσωματώσεις και συστήματα δεν περιλαμβάνουν αυτόματα Παρακολούθηση συμβάντων Google Analytics στις πλατφόρμες τους. Μεγάλο μέρος του χρόνου που εργάζομαι σε ιστότοπους πελατών αναπτύσσω παρακολούθηση για συμβάντα για να παρέχω στον πελάτη τις πληροφορίες που χρειάζεται σχετικά με τις συμπεριφορές χρηστών που λειτουργούν ή δεν λειτουργούν στον ιστότοπο.

Πιο πρόσφατα, έγραψα για τον τρόπο παρακολούθησης mail σε κλικ, κλικ στο τηλκαι Υποβολές φόρμας Elementor. Θα συνεχίσω να μοιράζομαι τις λύσεις που γράφω με την ελπίδα ότι θα σας βοηθήσουν να αναλύσετε καλύτερα την απόδοση του ιστότοπού σας ή της εφαρμογής Ιστού.

Αυτό το παράδειγμα παρέχει έναν πολύ απλό τρόπο ενσωμάτωσης της παρακολούθησης συμβάντων του Google Analytics σε οποιαδήποτε ετικέτα αγκύρωσης, προσθέτοντας ένα στοιχείο δεδομένων που περιλαμβάνει την Κατηγορία συμβάντων του Google Analytics, την Ενέργεια συμβάντος του Google Analytics και την ετικέτα συμβάντων του Google Analytics. Ακολουθεί ένα παράδειγμα μιας σύνδεσης που ενσωματώνει το στοιχείο δεδομένων, που ονομάζεται gaevent:

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

Απαραίτητη προϋπόθεση για τον ιστότοπό σας είναι να συμπεριλάβετε το jQuery σε αυτό… με το οποίο τροφοδοτείται αυτό το σενάριο. Μόλις φορτωθεί η σελίδα σας, αυτό το σενάριο προσθέτει έναν ακροατή στη σελίδα σας για όποιον κάνει κλικ σε ένα στοιχείο με gaevent δεδομένα… στη συνέχεια καταγράφει και αναλύει την κατηγορία, τη δράση και την ετικέτα που καθορίζετε στο πεδίο.

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

Δεν είναι το πιο στιβαρό σενάριο και μπορεί να χρειαστεί να κάνετε επιπλέον καθαρισμό, αλλά θα πρέπει να ξεκινήσετε!