[Aggiornata 01 Agosto 2022]

Attenzione: in seguito al provvedimento del Garante Privacy italiano che ha dichiarato illecita l’implementazione di Google Universal Analytics (GA3) su un sito web, è necessario eliminare il prima possibile la proprietà di GA3 dai propri progetti web e passare subito a GA4.

Se non hai dimestichezza con GA4 e desideri imparare a padroneggiare nel modo corretto questo strumento, nel mio libro su GA4 “Google Analytics 4 per chi inizia” ti guido passo passo per imparare a utilizzarlo in maniera semplice e pratica.

In fondo a questo articolo troverai il link alla guida su come tracciare lo User ID di Hotjar in GA4 🙂

–

Fammi indovinare, stai già usando Hotjar e vorresti spingere l’integrazione con Google Analytics.
Come possiamo fare?

Ovviamente devi aver già configurato Hotjar con Google Tag Manager e avere a disposizione almeno una dimensione personalizzata.

Devi sapere che, come per molti tool di web analytics, Hotjar utilizza un cookie per capire se sei un utente nuovo o di ritorno. Dentro alle statistiche di Hotjar è presente un valore “univoco” per utente derivato proprio da quel cookie. Ecco un esempio:

Quindi se riuscissimo ad utilizzare quel cookie e importalo su Google Analytics potremmo utilizzare la potenza di fuoco di GA.

La bella notizia è che è possibile farlo.

L’ottima notizia è che te la sto per spiegare passo passo.

STEP 1 – CREIAMO UNA VARIABILE JAVASCRIPT PERSONALIZZATA

Update: Hotjar ha cambiato ancora e ora bisogna aspettare qualche secondo per avere l’informazione necessaria

Estrapoliamo il valore completo del cookie attraverso la libreria JS di Hotjar, che “splittiamo”, recuperando la porzione di valore che ci interessa.

• Variabili > Nuova > Configurazione variabile.
• Tipo di variabile: Javascript personalizzato.
• Inserisci questo codice Javascript:

function() {
  var hotjarUserId = hj.globals.get("userId").split("-");
  
  if(hotjarUserId[0] != undefined)
  {
    return hotjarUserId[0];
  }
  else
  {
    return 0;  
  }
}

• Nome della Variabile: “Hotjar – User Id”.

STEP 2 – CREA LA DIMENSIONE PERSONALIZZATA

Ora non ci resta che salvare questo dato su Google Analytics su una dimensione personalizzata:

• Vai su Google Analytics.
• Clicca su Amministrazione > Proprietà > Definizioni personalizzate > Dimensioni personalizzate.
• Nuova dimensione personalizzata.
• Nome: Hotjar User Id.
• Ambito: Sessione.

Tieni a mente il valore numerico dell’indice (da 1 a 20). Nel mio caso è 1.

 

Non sai cos’è una dimensione personalizzata e vorresti capirne di più su Google Analytics?

STEP 3 – ATTIVATORE DI TIPO TIMER

Per permettere alla funzione di estrapolare lo user ID di Hotjar, dobbiamo attendere il caricamento della pagina. Quindi dobbiamo creare un nuovo attivatore che si attivi al dopo un tot di tempo. Dai miei test un timer di 3 secondi va più che bene. Chiaramente se un utente scappa prima che ci sia questa fase non avrai l’evento su Google Analytics (e nemmeno il valore di Hotjar User ID).

Creiamo l’attivatore:

• Attivatori > Nuovo > Configurazione attivatore.
• Tipo di attivatore: Timer
• Interval: 3000
  
• Limit: 1
• Enable this trigger: Page Path > matches RegEx > .*

STEP 4 – INSERIAMO LA DIMENSIONE IN UN EVENTO DI GOOGLE ANALYTICS

Bene, ora abbiamo una dimensione su Google Analytics pronta a ricevere dati e l’attivatore pronto. Non ci resta che passare il valore della seconda variabile creata a Google Analytics, che contiene effettivamente il codice ID di Hotjar.

Inizialmente sfruttavo già il Tag di Google Analytics relativo alla PageView che è già presente in GTM. Purtroppo non è più possibile usare questo meccanismo perché il il valore dello User Id di Hotjar ci mette qualche secondo dopo l’evento Window Loaded. Lo tracceremo quindi con un Tag di tipo Evento di Google Analytics.

• Tipo di tag: Universal Analytics
• Tipo di monitoraggio: Evento
• Categoria: Hotjar
• Azione: User Id
• Etichetta: {{Hotjar User Id}}
• Non-Interaction Hit: True
• Adesso seleziona la Variabile delle impostazioni di Google Analytics in Impostazioni di Google Analytics, se l’hai creata, oppure abilita l’override e seleziona la costante {{gaID}} (che dovresti avere se hai seguito la mia guida su come creare una costante per l’ID di monitoraggio di GA). In alternativa inserisci semplicemente il tuo codice UA-XXXXXX-X.
• Enable override settings: abilita

 

A questo punto inseriamo la dimensione personalizzata. Basterà scorre in basso e andare su

• Altre impostazioni > Dimensioni personalizzate.
• Clicca Aggiungi dimensione personalizzata.
• Indice: qua inserisci il valore indice della dimensione personalizzata visto prima (nel mio caso il valore è 1).
• Valore della dimensione: {{Hotjar – User Id}}
• Seleziona Attivatore: Timer 3 secondi

 

In questo modo ora l’evento avrà una dimensione personalizzata che contiene il codice User ID di Hotjar.

Se le nuove implementazioni funzionano correttamente, adesso puoi tornare su Google Tag Manager e cliccare sul pulsante blu “Invia” per pubblicare ufficialmente le modifiche.

E se uso Google Analytics 4?

Se cerchi una guida di Google Analytics 4 che ti spieghi come tracciare lo User ID di Hotjar in GA4, allora non ti preoccupare 😀

Ecco la guida: Come tracciare lo User ID di Hotjar in Google Analytics 4

Ti è stata utile questa guida? Fammelo sapere nei commenti 🙂

A presto e buon Tag!