Google Tag Manager: Ευελιξία και δύναμη στην ιστοσελίδα σας

Παρουσίαση με θέμα: "Google Tag Manager: Ευελιξία και δύναμη στην ιστοσελίδα σας"— Μεταγράφημα παρουσίασης:

1 Google Tag Manager: Ευελιξία και δύναμη στην ιστοσελίδα σας
Παναγιώτης Τζαμτζής Analytics Consultant / Data Collection Architect

2 Τι είναι ένα Tag management systems (TMS)
Με 1 γραμμή κώδικα JavaScript Αλλαγές στον κώδικα της σελίδας μέσω ενός online περιβάλλοντος (less coding) Επιτρέπει εγκατάσταση JavaScript, HTML και CSS Οι λειτουργίες εκτελούνται στον browser (Client-side)

3 Εργαλεία που υποστηρίζονται
Analytics Remarketing Παρακολούθηση αγορών Online chat Online ερωτηματολόγια Heat maps User recordings A/B test Διαχείριση popups Εργαλεία καταγραφής σφαλμάτων (bugs) Λειτουργικές αλλαγές (CSS, JavaScript, HTML, Cookies)

4 Πριν τα TMS Όλα αυτά αλλάξανε τα τελευταία 6 – 7 χρόνια!
Κάθε αλλαγή ήταν μέρος των διαδικασιών αλλαγής του website ελάχιστος χρόνος αναμονής 30 – 60 μέρες Διαδικασία που περιλάμβανε 20 – 30 άτομα Προγραμματισμός αλλαγής 3 μήνες νωρίτερα Σε περίπτωση bug διόρθωση μετά από 1 μήνα Όλα αυτά αλλάξανε τα τελευταία 6 – 7 χρόνια!

5 Γιατί TMS? Γρηγορότερο website Πιο εύκολες και γρήγορες αλλαγές
Λιγότερα λάθη κατά την συλλογή δεδομένων Μείωση κόστους Εύκολη διαχείριση περισσότερων εργαλείων Αναίρεση αλλαγών με ένα κλικ (Rollback)

6 Η αγορά σήμερα

7 Η αγορά σήμερα (Enterprise clients)

8 Η αγορά σήμερα (Όλα τα website)

9 Πως λειτουργεί? Τεχνικά χαρακτηριστικά
Κανόνες / φίλτρα εκτέλεσης κώδικα Έτοιμα templates Minification πηγαίου κώδικα Έλεγχος για λάθη Ασύγχρονη εκτέλεση TMS ( 1 ) TMS Server ( 2 )

10 Απαραίτητες γνώσεις HTML JavaScript Regex CSS Selectors jQuery
JavaScript US/docs/Web/JavaScript Regex CSS Selectors html-css/complex-selectors jQuery Web page performance gespeed/insights/

11 Εγκατάσταση

12 Πώς συλλέγουμε δεδομένα;
1 x 1

13 energy analytics and workflow automation
holistic use of solutions at global HQ level sports analytics communication for audience engagement reporting automation, comprehensive business answers data collection: tag management, QA, integrations ONLINE MARKETING & ECOMMERCE ANALYTICS EVENTS & SPORTS ANALYTICS ENERGY ANALYTICS

14 Google Tag Manager για προχωρημένους

15 Χρήσιμοι όροι Variables Είναι ένα μέσο προσωρινής αποθήκευσης που μπορούμε να χρησιμοποιήσουμε για να οργανώσουμε την πληροφορία μας Triggers / Events Όπως χρησιμοποιούμε τα events σε όλες τις γλώσσες προγραμματισμού, τα χρησιμοποιούμε για να ειδοποιήσουμε το TMS ότι έχει ολοκληρωθεί μια ενέργεια Tags Κομμάτια πηγαίου κώδικα, τα οποία έχουν πρόσβαση στα variables και ενεργοποιούνται βάσει των triggers

16 #1 Προσωπικά δεδομένα Αναζήτηση στοιχείων που μπορεί να είναι email
Δημιουργία Regex κανόνα που βρίσκει που βρίσκει Αντικατάσταση με μια άλλη τιμή (π.χ. “[PII_Mask- ]”) Το URL θα πρέπει να είναι decoded για να εντοπίζεται πάντα ένα

17 #1 Προσωπικά δεδομένα Δημιουργία καινούργιου variable στο GTM, με πηγαίο κώδικα

18 #2 Συνδυάζοντας διαφορετικά δεδομένα
Επιλέγουμε το web service που θέλουμε να εξάγουμε δεδομένα Δημιουργούμε ένα καινούργιο tag που επικοινωνεί με αυτό Χρησιμοποιούμε ένα trigger για να καταλάβουμε ότι ολοκληρώθηκε η επικοινωνία με το web service Αποθηκεύουμε τα αποτελέσματα στο data layer

19 #2 Συνδυάζοντας διαφορετικά δεδομένα
Για να χρησιμοποιήσουμε τα αποτελέσματα, δημιουργούμε ένα καινούργιο tag το οποίο ενεργοποιείται από το trigger που ορίσαμε στο προηγούμενο βήμα

20 #3 Εντοπισμός Adblocker
Όλοι οι adblocker ψάχνουν για συγκεκριμένα αρχεία ή URLs που μπορεί να “προδίδουν” μια διαφήμιση. Φορτώνουμε ένα “δόλωμα” για να δούμε αν θα “περάσει” Φορτώνουμε το αρχείο δόλωμα όσο νωρίτερα μπορούμε και synchronously Το αρχείο δόλωμα αποτελείται από λέξεις κλειδιά όπως “advertisement.js” και “ad_url”

21 #3 Εντοπισμός Adblocker
Όταν ολοκληρωθεί το φόρτωμα της σελίδας ψάχνουμε αν “τσίμπησε” κανείς το δόλωμα Υπάρχουν adblockers που θα μπλοκάρουν ακόμα κα το Google Tag Manager

22 #4 Βελτιώσεις SEO Οι crawler του Google άρχισαν πρόσφατα να υποστηρίζουν λίγη JavaScript Σε ένα καινούργιο tag απλά γράφουμε τον JavaScript κώδικα που θα μας κάνει τις απαραίτητες αλλαγές στα SEO meta tags Καλό είναι να τοποθετηθούν τέτοιου είδους tag είτε στο pageview ή στο DOM ready trigger. Αν χρησιμοποιούμε jQuery βεβαιωνόμαστε ότι υπάρχει διαθέσιμο πριν γίνουν trigger!

23 #4 Βελτιώσεις SEO Μπορούμε να προσθέσουμε ακόμα και εξτρά δομημένες πληροφορίες (Rich data format) με το κατάλληλο JSON schema Αρχικά βρίσκουμε το κατάλληλο schema Το προσθέτουμε σε ένα καινούργιο tag

24 #4 Βελτιώσεις SEO

25 #5 Εμπλουτισμός δεδομένων
Αποθηκεύουμε πληροφορία για τους χρήστες (π.χ. Τελευταία επίσκεψη)

26 #5 Εμπλουτισμός δεδομένων
Οργανώνουμε την πληροφορία σε λογικές ομάδες (π.χ. σύνολο επισκέψεων μέσα σε ένα χρονικό διάστημα)

27 #5 Εμπλουτισμός δεδομένων
Ενεργοποίηση λειτουργίας βάσει της ομάδας ή συνδυασμού ομάδων ενός επισκέπτη (π.χ. προσφορές ή suggestions)

28 #6 Μετασχηματισμός δεδομένων
Κοινή μορφοποίηση τιμών (π.χ. νομίσματα, ημερομηνίες) £ 480,00 $ 39.99 RUB 2.499 € 1,350.00 ¥ 600 Lookup tables Προϊόντα ανά κατηγορία Πηγές εισόδου ανά είδος Μετάφραση όρων σε κοινή γλώσσα Μετατροπή σε lowercase

29 #6 Μετασχηματισμός δεδομένων
Αντικατάσταση κειμένου Χαρακτήρες που δεν εμφανίζονται σωστά Μορφοποίηση που επιτρέπει την ευκολότερη ανάλυση δεδομένων Έλεγχος τιμών Ανήκει μια τιμή σε ένα σύνολο δεδομένων; Δημιουργία τυχαίων τιμών Sampling Randomization

30 #6 Μετασχηματισμός δεδομένων
Δημιουργία μεταβλητών στο GTM με πηγαίο κώδικα για μετασχηματισμό

31

32 Don’t be a stranger! Connect with us: At our booth www.baresquare.com
Contact me directly on LinkedIn Stay tuned for our next Digital analytics meetup