In questa guida andremo a spiegare come installare Customerly nel tuo sito attraverso Google Tag Manager.

Da quando ho iniziato a smanettare su Customerly non riesco proprio più a farne a meno. Se vuoi conoscere tutte le sue potenzialità e caratteristiche ti consiglio di dare uno sguardo al Glossario di Customerly 😉

Ma prima di spingere l’acceleratore dobbiamo metterci la benzina, ovvero dobbiamo installare Customerly. La via più semplice e soprattutto che ti permetterà di gestire le configurazioni più avanzati è l’installazione con Google Tag Manager.

Sei pronto? Iniziamo!

Step 1 – Preleva e copia lo snippet di codice di Customerly

La prima cosa da fare è entrare in Customerly e andare sulla voce “App Settings” che trovi sotto il menù dedicato al tuo profilo.

customerly integrazione google tag manager

Ora, ti basterà andare sulla voce nel menù in basso a sinistra “Integrations” e cliccare “integration”.

Snippet Customerly con Google Tag Manager

Una volta lì troverai una miriade di possibilità di installazione. Finché non ci sarà una voce dedicata a Google Tag Manager, puoi usare la prima voce “Web Integration“:

Snippet web integration Customerly con Google Tag Manager

A questo punto troverai il tuo script che ti servirà per avviare Customerly nella pagine del tuo sito. Non dovrai fare altro che copiare lo snippet.

Codice Snippet web integration Customerly con Google Tag Manager

Dovresti avere quindi uno snippet di codice simile a questo:

<script> 
window.customerlySettings = { app_id: "XXXXXXXX" }; !function(){function e(){var e=t.createElement("script");
e.type="text/javascript",e.async=!0,e.src="https://widget.customerly.io/widget/XXXXXXXX";
var r=t.getElementsByTagName("script")[0];r.parentNode.insertBefore(e,r)}var r=window,t=document,n=function(){n.c(arguments)};
r.customerly_queue=[],n.c=function(e){r.customerly_queue.push(e)},r.customerly=n,r.attachEvent?r.attachEvent("onload",e):r.addEventListener("load",e,!1)}(); 
</script>

 

Dove il valore XXXXXXXX corrisponde al tuo codice di Customerly.

Step 2 – Crea un Tag HTML personalizzato

Ora che hai il codice a portata di mano crea un Tag HTML personalizzato e mettici dentro il codice 🙂

  • Vai all’interno del contenitore di Google Tag Manager.
  • Sezione Tag > Nuovo > HTML personalizzato.
  • Incolla il codice che hai copiato prima
  • Su impostazioni avanzate seleziona: opzioni di attivazione tag: Una volta per pagina
  • Aggiungi l’Attivatore: All Pages.
  • Nomina il Tag: “Customerly”.
  • Salva.

step 2 - html personallizato Customerly con Google Tag Manager

Step 3 – Verifica che il tag si attivi e Customerly funzioni

Ormai ci siamo quasi 🙂

Verifichiamo che il tag si attivi e che il widget compaia!

step 3 verifica debug customerly con google tag manager

Ed ecco il widget attivarsi 🙂

step 3 verifica widget customerly con google tag manager

 

Aspetta, non è finita qui!

Bene, ora che hai installato Customerly, possiamo fare tantissime altre cose come:

  • gestire configurazioni del widget (colori, apertura o meno della chat a seconda di azioni)
  • creare e gestire attributi personalizzati per segmentare gli utenti
  • creare eventi personalizzati

Curioso? Sto realizzando la guida avanza di Customerly, a breve sarà disponibile. Se sei membro del Club di Tag Manager Italia all’interno della sezione CRO troverai i video. Non sei ancora membro? Scrivimi qui sotto un commento, ti contatterò personalmente 😉

Link utili:

Condividi anche tu Google Tag Manager!

Hai ancora qualche dubbio?
Chiedi pure qui sotto, sarò pronto a risponderti!

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Questo sito usa Akismet per ridurre lo spam. Scopri come i tuoi dati vengono elaborati.