Google Tag Manager - Guida rapida

Per comprendere Google Tag Manager, dobbiamo prima comprendere alcuni concetti correlati.

Marketing del prodotto - Background

Con l'avvento di Internet e del web, c'è stata un'immensa necessità di distinguersi dagli altri per promuovere il proprio prodotto. Questa era ha superato i tempi in cui la pubblicità e il marketing funzionavano in modo fantastico con i supporti cartacei.

Con la necessità di commercializzare il prodotto che diventa un compito mirato e abile, c'è una nuova generazione di professionisti chiamati "Product Marketers". Queste persone devono essere aggiornate con l'andamento del mercato, il comportamento degli utenti e le simpatie e le antipatie del loro pubblico.

Il marketer del prodotto, che indossa il cappello di un analista e di un inserzionista, ha bisogno di sapere molte cose per essere in cima alle cose. Una di queste cose è creare una campagna di marketing per il coinvolgimento degli utenti di successo.

Se andiamo con la definizione di Wikipedia per il marketing del prodotto - Product Marketing is the process of promoting and selling a product to an audience.

In breve, un marketer di prodotti deve creare varie campagne promozionali per rimanere in cima alla concorrenza, aumentando così le vendite.

Dal boom delle dot com, per un marketing di prodotto di successo, la presenza di un prodotto è richiesta non solo nel mondo reale ma anche nel mondo web. La presenza e l'accettazione nel mondo web è direttamente proporzionale al successo del prodotto.

Strumenti di marketing del prodotto

In questa ricerca di aumentare le vendite di prodotti oltre ad essere creativo, un marketer di prodotti deve essere consapevole di alcuni strumenti efficaci. Questi strumenti si dimostrano utili per commercializzare il prodotto e analizzare di conseguenza l'andamento degli utenti.

Di seguito sono riportati alcuni strumenti di marketing dei prodotti comunemente utilizzati:

  • statistiche di Google
  • Chartbeat
  • Kissmetrics
  • Metriche di sprint
  • Woopra
  • Clicky
  • Test utente
  • Crazy Egg
  • Mouseflow
  • Mint

Google, ovviamente, è in cima alla lista con la loro offerta: Google Analytics. Google ha introdotto questo strumento di analisi molto presto durante l'evoluzione del marketing del prodotto. In effetti, è lo strumento più affidabile e maggiormente utilizzato nella comunità del marketing di prodotto.

Lo strumento ha il suo modo unico di funzionare utilizzando un'interfaccia user-friendly. L'utente deve aggiungere il numero di account di Google Analytics alle rispettive pagine del sito Web / blog. Di conseguenza, le visite dell'utente ei clic vengono monitorati da Google Analytics.

Utilizzo di diversi strumenti di analisi

Simile a Google Analytics, ogni altro strumento fornito nell'elenco sopra ha un modo di funzionare diverso. Quando si tratta di utilizzare uno strumento particolare, è necessario modificare il codice del sito Web / blog per iniziare a monitorare il comportamento dell'utente.

Questi strumenti forniscono un'analisi su quale pagina è stata utilizzata più volte, quali sono state le attività eseguite dall'utente, ecc. Inoltre, questi strumenti possono fornire un rapido feedback sotto forma di dati per le funzionalità appena lanciate.

Il modo in cui funziona Google Analytics è abbastanza simile a come funzionerebbe la maggior parte degli altri strumenti elencati. Consideriamo ora un'organizzazione di prodotto relativamente grande, focalizzata sulla creazione di una nuova funzionalità per migliorare la loro esperienza del cliente. Per un'organizzazione su larga scala, è utile disporre di enormi processi / pipeline di rilascio, che ottengono la funzionalità desiderata in modo trasparente.

Accedi a Google Analytics. Affinché Google Analytics sia utile, è necessario che tutte le pagine nel codice del sito web del prodotto abbiano questo numero di account. Per quanto semplice possa sembrare, per le grandi organizzazioni di prodotto, a volte, l'aggiunta di una piccola parte di codice nella pagina può essere complicata e richiede test rigorosi dopo la creazione di questa funzionalità.

Se l'organizzazione del prodotto mira a utilizzare più strumenti di analisi dei dati come indicato nell'elenco precedente, moltiplicare lo sforzo in termini di tempo e costo per il numero di strumenti in uso. Questo diventa doloroso man mano che il prodotto matura. Alla fine, anche la valutazione del comportamento dell'utente diventa un must. In questi casi, è importante disporre di un meccanismo uno per tutti, in modo che diventi più facile per i marketer di prodotti creare al volo diverse campagne.

Poiché diversi strumenti utilizzano tecniche diverse per tenere traccia del comportamento dell'utente, è necessario scegliere un unico supporto, che tenga conto di queste diverse tecniche con strumenti diversi.

Google Tag Manager - Introduzione

Per un marketer di prodotti, l'utilizzo di strumenti diversi richiede la rispettiva curva di apprendimento. Avere strumenti diversi comporta l'inserimento di codici diversi e quindi le modifiche nel sito web. Se esiste un processo semplice e diretto per modificare il codice del sito Web, diventa un vero piacere aggiungere i diversi codici relativi a diversi strumenti analitici.

Google Tag Manager (GTM) è uno strumento gratuito che consente agli operatori di marketing di aggiungere e aggiornare facilmente i tag del sito web. I tag consentono il monitoraggio delle visualizzazioni della pagina del sito, il monitoraggio delle conversioni, ecc. Utilizzando Google Tag Manager, è possibile disporre di un'efficace soluzione di gestione dei tag che consente aggiornamenti rapidi e semplici nei tag del sito web. I tag sono fondamentalmente snippet di codice, destinati all'analisi del traffico e all'ottimizzazione del marketing.

Per un marketer di prodotti impegnato in diverse soluzioni di analisi dei prodotti, Google Tag Manager è un must, poiché copre molti aspetti del marketing di prodotto sotto lo stesso tetto. Puoi aggiungere e aggiornare AdWords, Google Analytics, Firebase Analytics, Floodlight e altri tag di terze parti utilizzando Google Tag Manager.

Per configurare Google Tag Manager, avere un sito web è un must. Ai fini del tutorial, eseguiremo il seguente processo per configurare Google Tag Manager.

  • Crea un blog con Blogger.com
  • Crea un account con Google Tag Manager
  • Installa un tag sul blog

Crea un blog con Blogger.com

Step 1 - Per iniziare a creare un blog, segui questo link - https://blogger.com. La home page di blogger apparirà come mostrato nello screenshot seguente.

Step 2 - Fare clic sul pulsante - CREA IL TUO BLOG per iniziare a creare un blog.

Come passaggio successivo, Blogger ti chiederà il tuo account Google. Blogger, essendo uno dei prodotti Google, ti semplifica la vita consentendo all'account Google di creare un blog online.

Step 3 - Inserisci le tue credenziali per Google e vedrai la seguente schermata per creare il tuo blog.

Step 4 - Scegli un titolo, un indirizzo e un tema del blog a tua scelta.

L'inserimento di un titolo è piuttosto semplice, puoi fornire qualsiasi titolo come preferisci. Con l'indirizzo, non appena inizi a digitare l'indirizzo del blog desiderato, l'interfaccia inizierà a cercare la disponibilità. La seguente schermata mostra come viene cercato l'indirizzo di un blog.

Una volta che hai finito con questo processo e l'indirizzo del blog è disponibile, vedrai il seguente messaggio nella casella di testo.

Come mostrato nello screenshot qui sopra, l'indirizzo del blog - https://gtmtutorial2017.blogspot.com è selezionato.

Step 5 - Dopo aver selezionato il design richiesto, fai clic sul pulsante rosso - Crea blog!

Il sistema impiegherà pochi secondi e il tuo nuovo blog sarà pronto. Una volta terminato, ti verrà presentata la seguente interfaccia per iniziare a scrivere un blog.

È necessario almeno un post per vedere il funzionamento efficace di Google Tag Manager.

Step 6 - Crea il tuo primo post sul blog facendo clic sul pulsante di collegamento in blu - Crea un nuovo post.

Step 7- Puoi iniziare a scrivere i contenuti del tuo primo post sul blog. Fornisci un titolo del post come richiesto nella parte superiore dello schermo.

Molte volte, blogger semplifica la composizione di contenuti sia HTML che rich text. Ciò è possibile utilizzando il pulsante di attivazione / disattivazione Componi / HTML nell'angolo in alto a sinistra dello schermo. Vediamo come utilizzare l'opzione Componi come esempio.

Step 8- Fai clic su Scrivi, verrà visualizzato un editor di testo RTF. Inizia ad aggiungere del contenuto.

Step 9 - Al termine, fai clic sul pulsante Pubblica nella sezione in alto a destra dello schermo.

Verrai reindirizzato allo schermo come mostrato nello screenshot qui sopra, con un nuovo post visibile nell'elenco. Questo conclude la creazione del sito in Blogger.com

Il passaggio successivo consiste nel creare un account Google Tag Manager. Quindi, aggiungeremo il codice del contenitore al sito Web. Infine, saremo in grado di monitorare le visualizzazioni di pagina / eventi corrispondenti con GTM.

Crea un account con Google Tag Manager (GTM)

Step 1- Per iniziare con Google Tag Manager, utilizza questo collegamento: Google Tag Manager . Vedrai la seguente home page per Google Tag Manager.

Step 2- Fare clic su uno dei collegamenti per REGISTRARSI GRATUITAMENTE. I collegamenti sono disponibili nella pagina - al centro e nell'angolo in alto a destra.

Step 3 - Vai avanti ed esplora la pagina come preferisci in quanto fornisce informazioni molto utili su Google Tag Manager.

Dopo aver fatto clic su REGISTRATI GRATUITAMENTE, ti verrà presentata la seguente schermata e l'URL cambierà in - https://tagmanager.google.com/?hl=en. Questo verrà visualizzato sotto la schermata per accedere con il tuo account Google.

Dopo aver inserito le tue credenziali per Google, verrà visualizzata l'interfaccia del tag manager.

Step 4- GTM richiederà di aggiungere il tuo nuovo account. Ci sono due passaggi:

  • Account di configurazione
  • Contenitore di configurazione

Step 5- Come primo passaggio, aggiungi il nome dell'account. Ai fini di questo tutorial, useremo il nome - Tutorial di Google Tag Manager. Puoi scegliere di condividere i dati in modo anonimo con Google e altri, per migliorare la tua esperienza di marketing del prodotto.

Step 6 - Fare clic su Continua.

Step 7- Il prossimo passo è configurare il contenitore. Fornisci un nome per il contenitore. Aggiungiamo il nome come - Tag Container. In Where to Use Container, come mostrato nello screenshot seguente, seleziona Web.

Step 8 - Fare clic su CREA.

Ti verrà quindi presentata una schermata per accettare i Termini di servizio di Google Tag Manager.

Step 9 - Fare clic su SI per procedere.

Step 10 - Infine, ti verrà presentato un set di frammenti di codice come mostrato nello screenshot seguente, che devono essere aggiunti sotto head e body tag.

Questi snippet di codice sono necessari affinché i dati del blog creato possano fluire nell'interfaccia di Google Tag Manager.

Esamineremo la creazione del tag e i rispettivi processi in un capitolo successivo.

Interfaccia di Google Tag Manager

Prendiamo un po 'di tempo per familiarizzare con le diverse sezioni dell'interfaccia di Google Tag Manager.

Innanzitutto, cerchiamo di capire come gestire le seguenti sezioni:

  • Workspace
  • Versions
  • Admin

Area di lavoro

La sezione dell'area di lavoro mostra il lavoro attivo in corso. Questa sezione ha diverse sottosezioni come:

  • Overview
  • Tags
  • Triggers
  • Variables
  • Folders

Impareremo di più su queste sottosezioni nei capitoli successivi.

Versioni

È molto comune per le grandi organizzazioni creare pochi tag e averli per il processo di revisione o approvazione.

Allo stesso tempo, potrebbe essere necessario comprendere i tag precedenti pubblicati sul sito web. Per tutti questi scopi, possiamo utilizzare la sezione Versioni. Questo mostra ogni possibile tag pubblicato nell'area di lavoro corrente e consente di ripristinare le modifiche, se necessario.

Admin

Se desideri configurare il tuo account Google Tag Manager per ambienti diversi o utenti diversi, puoi utilizzare questa sezione.

È inoltre possibile configurare i dettagli dell'account e rivedere le attività relative all'account, se ci sono più utenti associati a questo account.

Questo capitolo fornisce una panoramica su come iniziare con Google Tag Manager, aggiungere un tag e analizzarlo per verificarne la completezza.

Durante il processo, utilizzeremo il blog (creato nel capitolo precedente) per la dimostrazione dei diversi passaggi.

Step 1 - Come mostrato nella schermata sopra, fai clic sul codice del contenitore (GTM-XXXXXXX) nell'angolo in alto a destra accanto all'etichetta Modifiche area di lavoro: 0.

Vedrai la finestra di dialogo Installa Google Tag Manager.

Ora, qui vogliamo installare il codice di Google Tag Manager sul nostro blog.

Step 2 - Per ottenere il codice GTM nella figura sopra aggiunto sul blog, vai a https://Blogger.com e accedi con le tue credenziali.

Ti verrà presentata una schermata come mostrato di seguito con il nome del tuo post sul blog nell'elenco.

Step 3 - Dal pannello a sinistra, individua l'opzione: Tema.

Vedrai la seguente schermata.

Step 4- Fare clic su Modifica HTML per modificare il codice HTML per il blog. Sarà visibile un codice sorgente HTML per il tuo blog, come mostrato nella figura seguente.

Qui, vogliamo installare il codice Google Tag Manager. Come indicato da GTM, siamo tenuti a inserire il codice nelle seguenti posizioni:

  • Il più in alto possibile nel tag <head>
  • Nel tag <body>

Step 5- Individua il tag <head> nel codice HTML sopra. Torna ahttps://tagmanager.google.come copia il codice nella finestra di dialogo Installa Google Tag Manager al passaggio 1 sopra. Incolla il codice copiato esattamente sotto l'apertura del tag <head>.

Step 6 - Allo stesso modo, individua il tag <body> nel codice HTML.

Note- Puoi usare il tasto di scelta rapida Ctrl + F per trovare i tag <head> e <body>. La funzionalità di ricerca del browser tornerà utile per trovare i tag.

Una volta individuato il tag <body>, ripetere la procedura per copiare il codice associato al tag <body> da Google Tag Manager.

Per facilitare l'individuazione del tag, in genere, il tag <body> inizierà con <body expr: class = '"loading" + data: blog.mobileClass'>.

Incolla il codice richiesto sotto il tag <body>, quindi fai clic su Salva tema.

Mostrerà il seguente errore ed è normale vedere quell'errore.

Step 7 - Per risolvere questo problema, nel codice di Google Tag Manager sotto il tag <head>, individua la riga con -

j = d.createElement(s),dl = l != 'dataLayer'?' &l = '+l:'';j.async = true;j.src =

Sostituisci il & come sottolineato nella riga sopra con &amp;e fai clic su Salva tema. L'errore verrà risolto.

Questo conclude il processo di aggiunta del codice di Google Tag Manager al tuo blog.

Introduzione al tag

Come detto semplicemente sul sito web dell'assistenza di Google Tag Manager, un tag è un pezzo di codice che invia informazioni a una terza parte, come Google Analytics.

Prendendo spunto da lì, rispetto a un particolare strumento analitico, possono essere associati più tag. Averli tutti in una pagina è davvero un vantaggio, poiché il marketer del prodotto vedrà più metriche associate alla pagina.

Tuttavia, c'è un punto altrettanto importante da notare qui, non si dovrebbe esagerare con i tag su un sito web. Ciò non solo aumenta la confusione durante la gestione del tag, ma rende anche scomodo differenziare i dati provenienti da vari tag.

Il codice seguente, come abbiamo visto nella finestra di dialogo Installa Google Tag Manager, è in realtà un tag.

<!-- Google Tag Manager -->
<script>
   (function(w,d,s,l,i){
      w[l] = w[l]||[];w[l].push({'gtm.start':
      new Date().getTime(),event:'gtm.js'});
      var f = d.getElementsByTagName(s)[0], j = d.createElement(s),
      dl = l != 'dataLayer'?' &l = '+l:'';
      j.async = true;
      j.src = 'https://www.googletagmanager.com/gtm.js?id='+i+dl;
      f.parentNode.insertBefore(j,f);
   })
   (window,document,'script','dataLayer','GTM-M8QLQCZ');
</script>
<!-- End Google Tag Manager -->

Posizione di un tag

La posizione di un tag può essere ovunque nel codice sorgente della pagina. Può essere molto in alto come quello sopra o può sedersi nel piè di pagina trasmettendo le informazioni richieste.

Questo conclude una rapida introduzione a un tag e come può essere creato.

Trigger

Gli attivatori rilevano effettivamente quando un tag verrà attivato. Si tratta di un insieme di regole per configurare un tag da attivare. Ad esempio, gli attivatori possono decidere che un particolare tag "X" verrà attivato quando un utente esegue l'azione "Y". Più specificamente, un attivatore può indirizzare un tag ad attivarsi quando si fa clic su un pulsante particolare in una forma particolare.

I trigger sono condizioni che possono essere associate a un tag per funzionare nel modo desiderato. Un esempio del mondo reale sarà, considera che un tag è stato configurato per una transazione di successo su una pagina di e-commerce.

Il tag indicherà se la transazione è stata eseguita con successo. Per fare ciò, verrà creato un attivatore, che dirà, attiva il tag solo quando la pagina di conferma della transazione viene visualizzata all'utente.

In modo più evidente, considera di voler tenere traccia di tutte le visualizzazioni di pagina di un blog / sito web. Quindi, in particolare, puoi creare un tag con Google Analytics, che verrà attivato quando l'utente accede a qualsiasi pagina del tuo blog / sito web. Un attivatore in questo caso sarà generico, dicendo che attiva questo tag su tutte le pagine. Il trigger verrà impostato di conseguenza.

Il grilletto a volte può complicarsi. Ad esempio, se qualcuno fa clic su un pulsante in una pagina specifica, attiva un tag.

Come mostrato nella figura seguente, è possibile accedere ai trigger facendo clic su Trigger nel pannello laterale sinistro dello schermo.

Poiché non ci sono ancora trigger configurati, non vedrai risultati sui trigger.

Variabili

Essenzialmente, le variabili sono valori che possono essere modificati.

Ad esempio, consideriamo un semplice clic su un collegamento. Quando si fa clic su un collegamento, sono presenti diverse variabili integrate che vengono raccolte con questo evento di clic. Queste variabili possono eventualmente essere utilizzate per registrare il collegamento, che viene reindirizzato quando un utente fa clic sul pulsante di collegamento specifico.

Andando un po 'in dettaglio, puoi anche registrare la particolare classe div dell'elemento che è stato cliccato, utilizzando le variabili. Sono chiamate variabili, perché se ci sono 10 diversi pulsanti di collegamento sulla pagina, il reindirizzamento da questi pulsanti di collegamento cambierà, a seconda di quale degli elementi si fa clic.

È possibile accedere alle variabili utilizzando il pannello di sinistra e facendo clic su Variabili.

Google Tag Manager offre due tipi di variabili:

  • Variabili incorporate
  • Variabili definite dall'utente

Come indicano i nomi, puoi utilizzare le variabili esistenti offerte da Google Tag Manager oppure puoi creare le tue variabili.

Consideriamo un esempio e vediamo come funziona un tag. Eseguiremo il debug del tag ora con Google Tag Manager.

Debug di un tag

Nella sezione iniziale di questo capitolo, abbiamo dedicato del tempo ad aggiungere il codice di monitoraggio di Google Tag Manager al nostro blog su Blogger.com.

Questo è stato il primo passaggio per consentire a Google Tag Manager di identificare il nostro codice di monitoraggio. Se osservi attentamente, nello script che è stato incluso nel tag <head>, esiste un codice di monitoraggio di Google Tag Manager nel formato GTM-XXXXXXX.

Ora, quando si tratta di eseguire il debug di un tag, è abbastanza semplice con l'interfaccia di Google Tag Manager. Useremo il tag di base di Google Analytics per la dimostrazione. Supponiamo che esista già un account Google Analytics.

Creazione di un tag Google Analytics di base

In Google Tag Manager, per creare un tag, sono necessari vari passaggi. Per entrare nei dettagli di ciascuno di essi, consideriamo la seguente schermata.

Step 1 - Fare clic sul pulsante AGGIUNGI UN NUOVO TAG.

Un pannello da destra scorrerà per avviare il processo di creazione di un nuovo tag. Questo mostrerà un tag vuoto senza titolo da configurare.

Step 2- Fornisci un nome al tuo tag. Diamogli il nome: First Tag.

Step 3 - Al termine, fai clic sul testo / icona - Scegli un tipo di tag per iniziare la configurazione….

Un altro pannello scorrerà da destra, che avrà i seguenti tipi di tag visualizzati.

Come abbiamo visto nella definizione, ci sono diversi tag associati a diversi strumenti analitici. In questo particolare passaggio, Google Tag Manager richiede di specificare il tipo esatto di tag che desideri creare.

Noterai alcuni tipi di tag come segue:

  • Universal Analytics
  • Google Analytics classico
  • Remarketing AdWords
  • Google Optimize

Note- Universal Analytics è la versione migliorata e più popolare di Google Analytics. Tuttavia, esistono molti siti che utilizzano Google Analytics classico.

Per questo esempio, procediamo specificando Universal Analytics.

Step 4- Fai clic su Universal Analytics per continuare. Il controllo tornerà alla schermata precedente e ti verrà richiesto di selezionare cosa desideri monitorare. Vedere lo screenshot seguente per riferimento.

Step 5 - Seleziona Abilita la sostituzione delle impostazioni in questo tag.

Note- Stiamo utilizzando questo passaggio per acquisire familiarità con la creazione di tag a un ritmo più veloce. Puoi andare avanti e creare una variabile delle impostazioni di Google Analytics senza selezionare anche la casella di controllo sopra.

Step 6- Apri l'interfaccia di Google Analytics. In Google Analytics, individua il pulsanteADMINin prima pagina. Nella sezione Proprietà, fai clic su Impostazioni proprietà. Sarai in grado di vedere la schermata simile alla seguente.

Step 7- Copia l'ID di monitoraggio. L'ID di monitoraggio avrà il formato UA-XXXXX-X.

Step 8- Dopo aver copiato l'ID di monitoraggio, torna all'interfaccia di Google Tag Manager. Come già mostrato in precedenza, incolla l'ID di monitoraggio nella casella di testo associata.

Ora stiamo per configurare l'elemento importante del tag: un trigger.

Indicheremo a Google Tag Manager che il tag dovrebbe essere attivato se la pagina viene visualizzata dall'utente. Per fare ciò, dovremmo avere il trigger configurato utilizzando la sezione successiva sullo schermo.

Step 9 - Fai clic su Scegli un attivatore per attivare questo tag ...

Una finestra di dialogo scorrerà da sinistra, richiedendo di selezionare un trigger. Mostrerà il trigger come mostrato nello screenshot seguente.

Step 10 - Fare clic su Tutte le pagine.

Il controllo tornerà alla schermata di configurazione del tag. Fare clic sul pulsante blu SALVA nell'angolo in alto a destra. Hai configurato correttamente il tuo primo tag!

Step 11 - Ora per la modalità di debug, fai clic sul pulsante PREVIEW in grigio.

Come mostrato nello screenshot qui sopra, verrà visualizzata una casella arancione. Ciò indica che la modalità di debug è attiva. Accedi al tuo blog utilizzando il link disponibile.

Step 12 - Ora, quando accedi al blog, dovresti essere in grado di vedere una sezione sul tuo blog che mostra la sezione di debug di Google Tag Manager.

Inoltre, se osservi da vicino, c'è First Tagvisualizzato sotto Tag attivati ​​in questa pagina. Ciò indica che il nostro tag è stato attivato in caso di visualizzazione della pagina riuscita.

Step 13- Nella sezione di debug, fai clic su Variabili. Quindi, fare clic su Finestra caricata nel pannello di sinistra. Questa azione significa che stiamo selezionando un'azione per analizzare le variabili caricate come risultato di tale azione.

Mostrerà la sezione Variabili come si vede contrassegnata in una casella verde nella seguente schermata.

È possibile analizzare le variabili più chiaramente mentre si passa al capitolo successivo.

Dopo aver compreso il processo di creazione di un tag, ha senso immergersi in profondità e vedere come si ottiene il tracciamento utilizzando approcci diversi.

Tag visualizzazione pagina

Un marketer di prodotti deve comprendere il numero di visitatori per il sito Web / blog del prodotto. Questo è davvero fondamentale in quanto aiuta a capire l'andamento dei visitatori. Può essere sapere se un particolare miglioramento / caratteristica aggiunta nel sito / blog è apprezzato dal visitatore, sono i visitatori che accedono al sito su base giornaliera / settimanale, ecc.

Considerando che la "Visualizzazione di pagina" ha avuto un'enorme importanza nella comprensione della simpatia del sito Web / blog, vediamo come è possibile tenere traccia di una visualizzazione di pagina utilizzando un tag.

Step 1 - Poiché abbiamo seguito i passaggi nel capitolo precedente, accediamo alla sezione tag in Google Tag Manager.

Mostrerà il tag creato di recente - Primo tag.

Step 2 - Fare clic su First Tag, verrà visualizzata la finestra di dialogo con i trigger configurati, ecc.

Come evidenziato nello screenshot qui sopra, concentriamo la nostra attenzione sul Tracking ID.

Questo ID monitoraggio è associato a Google Analytics. Quando avviamo la modalità di debug e visitiamo il blog, verrà conteggiato come una singola visualizzazione di pagina.

In questo particolare momento, Google Analytics registrerà la visualizzazione della pagina nella sua interfaccia.

Step 3 - Esegui il debug utilizzando Google Tag Manager e apri il file Google Analytics dashboard, in Sorgenti di traffico → Panoramica, vedrai le seguenti statistiche.

Ciò mostra che una visualizzazione di pagina viene registrata e le visualizzazioni di pagina corrispondenti verranno monitorate ulteriormente in Google Analytics.

Tag di collegamento

Molte volte ci saranno alcune offerte promozionali per le quali a un utente potrebbe essere richiesto di lasciare il blog o il sito web. Insieme alle promozioni, questi possono essere alcuni sondaggi di terze parti che un utente potrebbe essere tenuto a prendere. Questi sondaggi produrranno determinate statistiche, che saranno diverse dai dati che arrivano tramite tag diversi.

A tal fine, è utile che il monitoraggio sia abilitato su quante volte il collegamento viene cliccato e l'utente viene indirizzato lontano dal sito web. Tali collegamenti sono definiti comeoutbound links e questi collegamenti possono essere monitorati facilmente utilizzando Google Tag Manager.

Per dimostrarlo, creeremo un collegamento nel nostro blog.

Lo screenshot sopra mostra un collegamento chiamato - Un collegamento in uscita. Questo collegamento verrà utilizzato per il monitoraggio in Google Tag Manager. Reindirizza ahttps://www.google.com

Step 1- Vai all'area di lavoro di Google Tag Manager. Fare clic su Tag dal pannello di sinistra. Fare clic sul pulsante NUOVO nella pagina per iniziare a creare il tag del collegamento in uscita.

Chiamiamo il tag come - Tag link in uscita.

Step 2 - Segui la stessa procedura della configurazione iniziale del tag per inserire il codice di Google Analytics nel campo corretto - Tracking ID.

Step 3- Seleziona il campo Tipo di traccia come Evento. Sarai in grado di vedere ulteriormente le seguenti opzioni.

Queste opzioni sono in accordo con Tipo di traccia - Evento. Si noti che queste opzioni non saranno affatto disponibili in Tipo di traccia - Visualizzazione pagina. Questo perché, poiché stiamo allegando il codice di Google Analytics con il Google Tag Manager, per vedere i dettagli dell'evento in tempo reale, abbiamo bisogno di alcuni parametri.

Step 4- Compila i dettagli del modulo come di seguito. Il testo in grassetto sono i valori da inserire nelle caselle di testo.

  • Categoria - Outbound

  • Azione - Click

  • Lascia vuoti i campi Etichetta e Valore

  • Mantieni hit di non interazione come False

Step 5 - Successivamente, nella sezione Attivazione, fai clic su Scegli un attivatore per attivare questo tag ...

Step 6- Fare clic sull'icona blu + nell'angolo in alto a destra. Si aprirà la sezione trigger personalizzato. Assegna un nome a questo trigger come - Fai clic su Trigger.

Step 7 - Fai clic su Scegli un tipo di trigger per avviare la configurazione ...

Mostrerà i seguenti tipi di trigger come mostrato nello screenshot seguente.

Step 8- Come evidenziato nella figura sopra, fare clic su Solo collegamenti in Tipo di attivazione clic. Questo mostrerà le diverse opzioni per configurare il tipo di trigger appena creato.

Ora, dobbiamo configurare l'attivatore in modo che si attivi se l'URL su cui si è fatto clic ha un percorso pagina come https://www.google.com. Nota che abbiamo configurato il collegamento sul nostro blog per reindirizzare allo stesso URL.

Step 9 - Configurare il trigger come previsto esattamente nella figura sopra.

Vogliamo configurare questo attivatore in modo che si attivi su alcuni clic sui link quando l'URL della pagina è ugualehttps://www.google.com. Una volta terminato, lo schermo dovrebbe apparire come il seguente.

Step 10 - Fare clic su SAVEper salvare questo trigger appena creato. La schermata tornerà alla configurazione di tag per Outbound link Tag .

Step 11 - Fare clic su SALVA per completare la configurazione.

Come evidenziato nella figura sopra, un tag completo per il link in uscita dovrebbe essere simile al precedente.

Ora, mettiamo in azione il tag.

Step 12- Dall'area di lavoro, fare clic sul pulsante ANTEPRIMA. Verrà avviata la modalità di debug.

Step 13- Nel tuo browser, in un'altra scheda, apri il tuo blog. La finestra di debug verrà visualizzata nella parte inferiore dello schermo.

Come mostrato sopra, poiché non abbiamo ancora cliccato sul link, il tag appare ancora sotto Tag non attivati ​​in questa pagina.

Step 14- Fai clic sul link in uscita come creato nel passaggio precedente, il tag verrà attivato. Puoi vederlo apparire sotto Tag attivati ​​in questa pagina.

Questo conclude l'approccio per la creazione di un tag per un collegamento in uscita per tenere traccia dei collegamenti sul blog / sito Web.

Monitoraggio degli eventi

Il monitoraggio degli eventi indica qualsiasi azione diversa dal caricamento di una pagina. Il browser ha una risposta specifica a qualsiasi azione che esegui sulla pagina. Ad esempio, l'azione può essere semplice come fare clic su un collegamento o inviare un modulo a un modulo complesso come il monitoraggio delle visualizzazioni e dei download di file.

Con Google Tag Manager, puoi facilmente monitorare gli eventi generati nel browser. Registra le risposte dal browser per un'azione potenziale, ottenendo così facilmente la traccia dell'evento particolare.

Useremo l'esempio sopra per vedere il monitoraggio degli eventi in azione. Nell'esempio precedente abbiamo creato un collegamento, che reindirizza dal nostro blog. In questo esempio, creeremo un altro collegamento, che punterà verso il nostro blog. Stiamo usando questo esempio per dimostrare come i link che si allontanano dal blog possono essere monitorati senza problemi.

Ho creato un collegamento chiamato Collegamento interno nel blog. Questo collegamento reindirizzerà alla stessa pagina del blog.

Andiamo alla dashboard di Google Tag Manager e creiamo un nuovo trigger per il link in uscita. Per questo utilizzeremo l'URL di clic variabile integrato. Utilizzando l'URL di clic, rileveremo se il collegamento su cui si fa clic sta reindirizzando l'utente al di fuori del blog o meno.

Per abilitare l'URL di clic della variabile incorporata, seguire i passaggi.

Step 1- Nella sezione Variabili, fare clic sul pulsante in rosso, CONFIGURA. Mostrerà le variabili integrate disponibili. Sono disponibili diverse variabili integrate, che sono: pagine, utilità, errori, clic, ecc.

Step 2- Nella categoria Clic, seleziona la casella URL clic. Questo mostrerà immediatamente le variabili disponibili nell'URL di clic. Vedere la schermata seguente per riferimento.

Ora che la variabile è configurata, possiamo configurare il trigger.

Il trigger verrà abilitato quando un utente fa clic su tutti gli URL, che stanno reindirizzando al di fuori del blog. La creazione di questo trigger è abbastanza semplice.

Step 3- Vai su Trigger, fai clic su Nuovo. Fornisci un nome al trigger. Diciamo che il nome è - External Link Trigger.

Step 4 - In Configurazione trigger, fai clic su Scegli un tipo di trigger per avviare la configurazione ...

Step 5- Dalle opzioni disponibili, sotto Fare clic, selezionare Solo collegamenti. Vedere la schermata seguente per i passaggi finora.

Quando si fa clic su Solo collegamenti, si viene reindirizzati alla prima sezione, dove sarà necessario fornire l'eccezione URL. Di seguito sono riportati i passaggi per farlo.

Step 6 - Per l'opzione, Questo trigger si attiva, seleziona Alcuni clic sui link.

Step 7- Sotto le condizioni, seleziona URL di clic, che dovrebbe essere selezionato in precedenza. Selezionare il valore non contiene dalle opzioni delle condizioni.

Step 8- Nella casella di testo per il valore, inserisci un valore che è l'URL del tuo blog. Nel nostro caso, inseriremo gtmtutorial2017.blogspot.in. Una volta terminato, lo schermo sarà simile al seguente.

Step 9 - Fare clic sul pulsante Salva in blu per salvare il nuovo trigger.

Ora è il momento di configurare il nostro tag, che useremo per tenere traccia dell'evento clic, che reindirizzerà l'utente al di fuori del blog.

Step 10- Apri la sezione Tag, fai clic sul pulsante NUOVO. Fornisci un nome al tuo tag, chiamiamolo - Tag collegamento esterno.

Step 11 - In Configurazione tag, fai clic su Scegli un tipo di tag per avviare la configurazione… Seleziona il tipo di tag come Universal Analytics e inserisci i seguenti dettagli sullo schermo.

  • In Tipo di traccia, seleziona Evento
  • Per Categoria: inserisci Link esterno
  • In azione: inserisci Click
  • Per l'etichetta, fare clic sull'icona delle opzioni

Step 12 - Nel pannello laterale visualizzato, seleziona URL di clic.

Step 13- Una volta terminato, seleziona la casella Abilita la sovrascrittura delle impostazioni in questo tag. Nella casella di testo ID monitoraggio, inserisci il codice di monitoraggio di Google Analytics.

Step 14- Scorri verso il basso per configurare l'attivazione. Useremo il nostro trigger appena creato.

Step 15- Fai clic su Scegli un attivatore per attivare questo tag ... Verranno visualizzati gli attivatori disponibili. Seleziona Trigger collegamento esterno, che abbiamo creato in precedenza.

Questo conclude la configurazione del tag. Fare clic sul pulsante Salva.

Step 16- Ora, per eseguire il debug del tag, fai clic sul pulsante Anteprima in grigio. Avvierà Google Tag Manager in modalità di debug.

Step 17- Torna al tuo blog e aggiorna il blog per avviare il debugger di Google Tag Manager. Considerando l'esempio sopra, ci sono due collegamenti mostrati nella pagina. Inoltre, c'è il tag di collegamento esterno, che è mostrato sotto Tag non attivati ​​in questa pagina.

Ora è il momento di testare la configurazione del tag. Useremo Ctrl + clic in entrambi gli scenari per verificare se il tag è attivato. Ctrl + clic farà aprire il collegamento nella nuova scheda, senza aggiornare la pagina corrente. Dobbiamo mantenere la pagina intatta, poiché non saremo in grado di vedere i tag attivati, se la pagina si aggiorna.

Step 18- Innanzitutto, utilizzare Ctrl + clic sul collegamento interno come evidenziato nella figura sopra. Idealmente, il tag non dovrebbe essere attivato, poiché il collegamento indirizza l'utente allo stesso blog.

Come mostrato nella figura sopra, nella sezione Riepilogo del debugger, vedrai un altro evento: gtm.linkClick. Ciò significa che GTM ha registrato l'evento clic.

Ma non vedrai alcun cambiamento nella sezione Tag attivati ​​in questa pagina. Questo perché abbiamo configurato la scheda per i link in uscita.

Step 19 - Ora Ctrl + clic su Un collegamento in uscita (questo è stato creato nella sezione precedente).

Osserva la sezione di riepilogo, verrà nuovamente aggiornata per un altro evento: gtm.linkClick.

Come mostrato nella figura sopra, per il prossimo evento registrato, verrà attivato un tag: External Link Tag. Potrai vederlo sotto Tag attivati ​​in questa pagina.

In questo modo, puoi utilizzare il monitoraggio degli eventi con Google Tag Manager e configurare i tag per i dati critici di cui hai bisogno dal tuo sito web / blog.

Monitoraggio dei moduli

Il più delle volte, su qualsiasi sito web / blog vedrai un modulo, che catturerà alcuni dettagli dall'utente. In qualità di marketer di prodotti, diventa noioso sapere se il modulo viene utilizzato dai visitatori.

Può essere un buon approccio sapere quante volte un utente ha compilato le informazioni in questo modulo e quante volte si è imbattuto in un errore. Con Google Tag Manager, puoi facilmente tenere traccia degli invii di moduli. Questa sezione ti guiderà attraverso il processo.

Per questo esempio, avremo un modulo Contattaci creato sul nostro blog.

Step 1- Per i blogger, per creare un modulo di contatto, utilizzare l'opzione Layout → Aggiungi un gadget. Dopo aver fatto clic su Aggiungi un gadget, vedrai la seguente schermata, dove troverai il gadget di Ricerca Blog. Fare clic sull'icona blu più (+) per inserirlo nel blog.

Una volta terminato, verrà visualizzato sul tuo blog come mostrato nello screenshot seguente.

Ora, configuriamo i relativi trigger e il tag.

Per iniziare con il trigger, seguiremo gli stessi passaggi. Per prima cosa aggiungeremo l'abilitazione a una variabile incorporata chiamata ID modulo, quindi creeremo un trigger che utilizzerà questa variabile appena creata.

Una volta terminato, utilizzeremo questo nuovo trigger per configurare un tag per monitorare le interazioni con il modulo.

Per abilitare la variabile incorporata ID modulo, di seguito sono riportati i passaggi.

Step 2- Nella sezione Variabili, fare clic sul pulsante in rosso, CONFIGURA. Dalla categoria Moduli, seleziona la casella ID modulo. Questo mostrerà immediatamente l'ID del modulo nelle variabili disponibili. Vedere la schermata seguente per riferimento.

Ora che la variabile è configurata, possiamo configurare il trigger.

Il trigger verrà abilitato quando l'utente invia i dati nel modulo Contattaci.

Step 3- Per farlo, vai su Trigger, fai clic su Nuovo. Fornisci un nome al trigger. Chiamiamolo come - Trigger di invio modulo.

Step 4 - In Configurazione trigger, fai clic su Scegli un tipo di trigger per avviare la configurazione ...

Step 5- Dalle opzioni disponibili, in Coinvolgimento utente, seleziona Invio modulo. Vedere la schermata seguente per i passaggi finora.

Quando si fa clic su Invio modulo, si viene reindirizzati alla prima sezione, dove sarà necessario fornire l'ID modulo.

Step 6 - Per l'opzione, Questo trigger si attiva, seleziona Tutti i moduli.

Una volta terminato il passaggio precedente, abiliterà il monitoraggio di tutti i moduli inviati sulla pagina del blog. Puoi anche utilizzare un ID modulo specifico, che può essere configurato quando hai creato il tuo blog.

Per configurare un ID modulo specifico, puoi richiedere il supporto dello sviluppatore del tuo sito Web / blog per ottenere maggiori dettagli. Dopo aver completato questi passaggi, vedere la seguente schermata per un riferimento completo.

Step 7 - Fare clic sul pulsante Salva in blu per salvare il nuovo trigger.

Ora è il momento di configurare il nostro tag, che useremo per tracciare l'evento clic che reindirizzerà l'utente al di fuori del blog.

Step 8- Apri la sezione Tag, fai clic sul pulsante NUOVO. Fornisci un nome al tuo tag, chiamiamolo - Form Submission Tag.

Step 9 - In Configurazione tag, fai clic su Scegli un tipo di tag per avviare la configurazione ... Seleziona il tipo di tag come Universal Analytics e inserisci i seguenti dettagli:

  • In Tipo di traccia, seleziona Evento
  • Per la categoria: immettere Invio modulo
  • In azione: inserisci il modulo inviato
  • Per l'etichetta, fare clic sull'icona delle opzioni

Step 10 - Nel pannello laterale visualizzato, seleziona ID modulo.

Step 11- Una volta terminato, seleziona Abilita impostazioni di sostituzione in questo tag. Nella casella di testo Tracking ID, inserisci il tuo codice di monitoraggio di Google Analytics.

Scorri verso il basso per configurare l'attivazione. Useremo il nostro trigger appena creato.

Step 12- Fai clic su Scegli un attivatore per attivare questo tag ... Verranno visualizzati gli attivatori disponibili. Seleziona Attivazione invio modulo, che abbiamo creato in precedenza.

Questo conclude la configurazione del tag. Fare clic sul pulsante Salva.

Step 13- Ora, per eseguire il debug del tag, fai clic sul pulsante Anteprima in grigio. Avvierà Google Tag Manager in modalità di debug.

Step 14- Torna al tuo blog e aggiorna il blog per avviare il debugger di Google Tag Manager. Ci sarà il tag di invio del modulo, che viene mostrato sotto Tag non attivati ​​in questa pagina.

Step 15- Ora interagisci con il modulo Cerca in questo blog inserendo alcuni valori in esso. Digitiamo Primo, poiché il nostro primo post sul blog contiene la parola Primo.

Step 16- Fare clic su Cerca. Il nuovo evento verrà visualizzato in Riepilogo e il tag di invio del modulo verrà visualizzato in Tag attivati ​​in questa pagina.

In questo modo, possiamo creare tag per l'invio di moduli utilizzando Google Tag Manager.

Oltre a creare i tag e gestire gli attivatori e le variabili associati, Google Tag Manager ha alcune altre funzionalità da offrire. Ciò include le cose di pulizia come l'organizzazione degli utenti, le cartelle utilizzate per organizzare i tag secondo l'ordine desiderato, ecc.

In questa sezione, avremo una panoramica su come gestire gli utenti e le diverse cartelle relative ai tag.

Gestione utenti

Non è raro che un team di marketing di prodotto utilizzi un singolo account Google Tag Manager per gestire diverse campagne di marketing. Ci saranno diversi ruoli, che avranno determinate autorizzazioni come la creazione di un tag, l'eliminazione / modifica di un tag, la creazione di un altro utente, ecc.

Gestione utenti fornisce un portale completo per la gestione degli utenti che utilizzano le funzionalità di GTM. La gestione degli utenti funziona a due livelli:

  • Livello account
  • Livello contenitore

Per accedere a Gestione utenti, fare clic su AMMINISTRAZIONE dalla barra dei menu in alto a sinistra.

Come mostrato nella figura seguente, sarai in grado di vedere la gestione utenti associata ad account e container.

L'importante differenza tra i due è: se fornisci l'accesso a un utente a livello di account, l'utente ha accesso a tutti i contenitori sotto quell'account. Mentre, se l'accesso è fornito all'utente a livello di contenitore, l'utente può modificare / aggiungere / eliminare i tag solo sotto quel contenitore.

Per vedere i dettagli di cosa sono disponibili tutti i livelli di accesso, fare clic su Gestione utenti under the Container level (evidenziato in giallo sopra).

Questo mostrerà gli account disponibili con le autorizzazioni fornite. Principalmente, sarà l'account Google che stai utilizzando per accedere a GTM.

Fare clic sul pulsante NUOVO in rosso. Mostrerà la seguente schermata.

Come mostrato in figura, è possibile aggiungere un indirizzo di posta elettronica a propria scelta, a cui si desidera assegnare le autorizzazioni di accesso e quindi fornire le autorizzazioni desiderate a livello di contenitore.

Di seguito sono riportate le autorizzazioni disponibili:

  • No Access - Impedisci all'utente di accedere ai tag del contenitore.

  • Read- L'utente potrà solo leggere i tag. Non è possibile eseguire modifiche o operazioni di cancellazione.

  • Edit - L'utente può aggiungere / modificare / eliminare i tag disponibili.

  • Approve- L'utente dispone di un'autorizzazione elevata per approvare i tag nell'ambiente live. Maggiori informazioni sugli ambienti più avanti nel tutorial.

  • Publish - Tutte le autorizzazioni, simili a un utente amministratore.

Questo conclude la panoramica della gestione degli utenti a livello di contenitore.

At the account level, è possibile configurare un utente come utente generale o utente amministratore.

Autorizzazioni simili possono essere assegnate all'utente che viene aggiunto; l'unica differenza è che l'utente avrà accesso a tutti i contenitori con questo account.

Questo conclude una panoramica della gestione degli utenti a livello di account.

Cartelle

Le cartelle sono necessarie soprattutto quando hai numerosi tag e attivatori nel tuo account. Le cartelle possono rivelarsi utili quando hai un numero così elevato di tag / trigger da gestire.

Per organizzare i tag e i trigger in queste cartelle, si può usare la propria creatività. Le cartelle possono essere create sulla base di diverse aree applicative o degli utenti o forse dello scopo per cui vengono create. Il team di marketing dei prodotti può prendere la propria decisione di disporre di una struttura di cartelle specifica.

Un altro modo di guardare le cartelle può essere un aspetto degli strumenti analitici in uso. Sulla base dello strumento analitico, è possibile creare un tag, che sarà utile a lungo termine.

Per creare cartelle diverse, fare clic su Cartelle dal pannello di sinistra. Vedrai la seguente schermata.

I tag creati fino ad ora verranno visualizzati sullo schermo. È possibile organizzare i tag creando cartelle diverse utilizzando l'opzione - NUOVA CARTELLA visualizzata nell'angolo in alto a destra dello schermo.

Dopo aver fatto clic su NUOVA CARTELLA, si aprirà un rapido popup come segue.

Dalla schermata precedente, puoi sempre spostare i tag secondo le tue esigenze nella cartella desiderata.

Questo conclude l'introduzione alla creazione di cartelle in Google Tag Manager.

Abbiamo creato, modificato e debug dei tag nel nostro ambiente di debugger. Fino ad ora, non abbiamo visto i tag dal vivo sul nostro blog.

Per pubblicare i tag sul blog, è necessario pubblicare i tag. Vorremo avere i tag pubblicati piuttosto che avere sempre la modalità Anteprima.

La pubblicazione dei tag è abbastanza semplice.

Step 1 - Fare clic sul pulsante INVIA nell'angolo in alto a destra dello schermo.

Mostrerà la seguente schermata.

Step 2 - Immettere un nome di versione identificabile in modo che possa essere facilmente compreso per le modifiche apportate.

Con la descrizione della versione, puoi essere il più elaborato possibile sulle modifiche / aggiunte del tag in quella particolare versione.

Step 3 - Scorri verso il basso fino a Modifiche dell'area di lavoro, vedrai tutte le modifiche apportate nei tag, che sono inedite o in modalità PREVIEW.

Allo stesso modo, in Cronologia attività, puoi ottenere una comprensione esatta delle modifiche / aggiornamenti che sono stati effettuati nell'account dall'inizio del tempo.

Step 4- Fornire un nome di versione, una descrizione. Potresti voler fornire il nome della versione come Prima versione e puoi fornire la descrizione come Primo aggiornamento di Google Tag Manager.

Per il momento, lasceremo Pubblica su Environment come Live. Questo perché non abbiamo ancora nessun altro ambiente oltre a Live.

Step 5 - Fai clic su PUBBLICA e ti verrà presentato un riepilogo per questa particolare versione.

In questo modo puoi pubblicare le modifiche apportate nell'area di lavoro per Google Tag Manager.

Puoi utilizzare un plug-in di Google Chrome - Google Tag Assistant per vedere i tag attivati ​​senza la modalità di anteprima attiva.

Creazione di ambienti in Google Tag Manager

Esistono diversi modi in cui possiamo configurare un ambiente da utilizzare con Google Tag Manager.

Di solito, nel mondo del software, la parola Ambiente viene utilizzata nel contesto in cui la particolare caratteristica viene testata / rivista.

Step 1 - Per visualizzare gli ambienti disponibili in Google Tag Manager, fare clic su AMMINISTRAZIONE.

Step 2 - Nella sezione Contenitore, fai clic su Ambienti.

Sarai in grado di vedere lo schermo come mostrato sopra.

In genere, le grandi società di software hanno il proprio sito Web suddiviso in ambienti diversi per facilitare il processo di rilascio di una funzionalità. Gli sviluppatori lavorano sul loro sito Web di sviluppo, quindi le modifiche alle funzionalità vengono inviate al sito di staging. Infine, quando le modifiche vengono verificate nel sito di staging, le modifiche vengono inviate all'ambiente Live.

Nel contesto di Google Tag Manager, c'è la flessibilità di aggiungere diversi ambienti, che ti consentiranno di convalidare completamente il tuo tag prima che siano sul sito web Live. Per questo tutorial, creeremo un ambiente, chiamato Dev environment. Di seguito sono riportati i passaggi.

Step 3- Fare clic sul pulsante NUOVO in rosso. Sarai in grado di vedere la seguente finestra di dialogo.

Step 4- Completare i dettagli come mostrato nella figura sopra. Faremo finta che il nostro sito di sviluppo sia lo stesso sito in cui stiamo lavorando in questo momento, al fine di applicare le modifiche di conseguenza.

Step 5 - Fare clic su CREA e verrà visualizzato un messaggio come il seguente.

Come mostrato nella figura sopra, il prompt mostra due modi per utilizzare l'ambiente.

  • Using a Share Preview Link - Questo collegamento è utile quando vuoi far circolare le modifiche nei tuoi tag ai membri del tuo team, quando ci sono team più grandi.

  • With a snippet- Se sei chiaro che un determinato sito funzionerà come ambiente di sviluppo / gestione temporanea, puoi utilizzare questa opzione di snippet. È disponibile uno snippet per questo ambiente, in modo da poter accedere al sito Web per visualizzare eventuali modifiche apportate di recente.

Step 6- Fai clic su PUBBLICA SU SVILUPPATORE per vederli in azione. La schermata successiva richiederà le modifiche disponibili da inserire nell'ambiente appena creato.

Verranno mostrate le modifiche non ancora inviate al rispettivo ambiente. Inoltre, viene visualizzato il nome della versione, in modo che l'utente sia chiaro quale versione viene pubblicata nel rispettivo ambiente.

Step 7- Fare clic su PUBBLICA ORA per vedere le modifiche disponibili nell'ambiente appena creato. Mostrerà il messaggio di successo con una data e un timestamp.

Dall'elenco di ambienti disponibili, fare clic sul nome del nuovo ambiente, nel nostro caso - Dev.

Verranno visualizzate le opzioni disponibili per condividere il collegamento all'ambiente, come mostrato di seguito.

Utilizzando uno qualsiasi degli approcci di cui sopra, sarai in grado di vedere le modifiche nel tuo tag nel tuo ambiente di sviluppo (Dev).

Un livello dati può essere visto come un oggetto che contiene tutte le informazioni da trasmettere ed elaborare con Google Tag Manager. Questo è un concetto un po 'tecnico. Il termine livello dati viene utilizzato per indicare la struttura dei dati utilizzata da Google Tag Manager per l'archiviazione, l'elaborazione e il trasferimento dei dati tra il tuo sito web / blog e il tag manager.

Per elaborarlo ulteriormente, un livello dati può inserire i dati nel tuo strumento di analisi sul tuo visitatore. Prendendo un'altra prospettiva per la definizione, Data Layer è in realtà un elenco di requisiti e obiettivi aziendali per ogni sottoinsieme del contesto digitale.

Prendiamo un esempio di sito web di e-commerce, i requisiti aziendali potrebbero includere:

  • Informazioni transazionali, con i dettagli su ciò che è stato acquistato

  • Dati dei visitatori, relativi a chi ha acquistato

  • Altri dettagli sull'acquisto, ad esempio dove è stato effettuato e a che ora

  • Infine, le informazioni su altri fattori, ad esempio se il visitatore si è iscritto o meno agli aggiornamenti e-mail

Quindi, in poche parole, il livello dati trasporta informazioni che possono essere utilizzate da diversi strumenti / utenti / parti interessate secondo necessità.

In Google Tag Manager, dataLayer è un array JavaScript. È costituito da coppie chiave-valore. Di seguito è riportato un rapido esempio di dataLayer con diversi tipi di dati:

dataLayer = [{
   'products': [{
      'name': 'Western Cotton',
      'tuning': 'High-G',
      'price': 49.75
   },
   {
      'name': 'Fenda Speakers',
      'tuning': 'Drop-C',
      'price': 199
   }],
   'stores': ['Hyderabad', 'Bangloer],
   'date': Sat Sep 13 2017 17:05:32 GMT+0530 (IST),
   'employee': {'name': 'Raghav}
}];

Qui abbiamo diversi valori come un array di oggetti (i prodotti), valori numerici (il prezzo), un array di stringhe (negozi), un oggetto data e un oggetto (nome).

In un'altra nota, quando inserisci il codice del contenitore di Google Tag Manager nel tuo sito web, il livello dati viene creato automaticamente.

Di per sé, il livello dati è un concetto piuttosto complesso da comprendere al primo tentativo. Questo capitolo fornirà ulteriori informazioni su come interagire con il livello dati.

Eventi livello dati

Un rapido esempio di evento del livello dati può essere un modulo di iscrizione alla newsletter, che non può essere facilmente monitorato con i listener GTM automatici. Uno sviluppatore di siti Web può supportarti per inviare un evento del livello dati una volta che un nuovo abbonato ha inserito la sua email sul tuo sito web. Il codice di questo evento dovrebbe assomigliare a questo:

push({‘event’: ‘new_subscriber’});

Se necessario, puoi chiedere al tuo sviluppatore ulteriori informazioni, come la posizione del modulo. Questo è necessario se sul tuo sito web sono presenti più moduli. Può essere ottenuto utilizzando il codice seguente.

window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
   'formLocation': ‘footer’,
   'event': new_subscriber
});

Inoltre, Google Tag Manager invia per impostazione predefinita un certo insieme di valori al livello dati delle applicazioni web. Questi valori sono:

  • gtm.js - Inserito nel livello dati non appena Google Tag Manager è pronto per essere eseguito

  • gtm.dom - Inserito nel livello dati quando il DOM è pronto

  • gtm.load - Inserito nel livello dati quando la finestra è completamente caricata

Ispezione del livello dati

Come già sappiamo, ci sono alcuni eventi che vengono creati a seguito di qualsiasi interazione sullo schermo.

Ad esempio, consideriamo questo semplice evento di caricamento della pagina. Per esaminare gli eventi, è necessario che il debugger sia in esecuzione. Una volta eseguito il debugger (in modalità anteprima), visita il blog. Se guardi la finestra di riepilogo nell'angolo in basso a sinistra, questo è ciò che vedrai:

Step 1 - Fare clic su Finestra caricata e quindi su Livello dati.

Le informazioni mostrate nella scheda Livello dati riguardano l'evento Finestra caricata.

Viene visualizzato come - {event: 'gtm.load', gtm.uniqueEventId: 3}

Inoltre, se vuoi dare un'occhiata più da vicino, devi ricevere supporto dalla scheda della console di Chrome. L'ispezione di un livello dati diventa facile quando sai come utilizzare il debugger di Chrome nel modo corretto.

Step 2- Quando sei sul tuo blog, fai clic con il pulsante destro del mouse in qualsiasi parte della pagina. Nel menu contestuale visualizzato, fare clic su Ispeziona. Il pannello verrà visualizzato sul lato destro dello schermo, con la scheda Elementi attivata.

Step 3- Fare clic su Console. In modalità console, fare clic sull'icona nell'angolo in alto a sinistra per cancellare tutti i messaggi visualizzati. Vedere lo screenshot seguente per riferimento.

Step 4- Una volta che la finestra è stata cancellata per eventuali messaggi precedenti, digita dataLayer, assicurati che le lettere maiuscole per L siano fatte. Questo nome è fornito da Google Tag Manager al suo livello dati. Tuttavia, i tuoi sviluppatori possono assegnargli un nome diverso se e quando richiesto.

Step 5- Premere Invio dopo dataLayer. Mostrerà i seguenti dettagli.

Ci sono tre oggetti e ogni oggetto contiene alcune informazioni. Ora, questi oggetti potrebbero non essere gli stessi per te, come sono mostrati nello screenshot qui sopra. Il dataLayer è configurabile ed è sotto il controllo dello sviluppatore configurarlo secondo il requisito.

I valori presenti sono dovuti al gadget Blogger in uso in quella particolare posizione / spazio. Questo è il motivo per cui ci sono alcune informazioni lì.

Se guardi l'oggetto 1, noterai che l'evento che viene generato è - gtm.dom . Viene attivato da GTM durante il caricamento della pagina.

In questo modo, puoi ispezionare il livello dati e aggiungere informazioni in esso come e quando necessario.

Variabili nel livello dati

Ora che abbiamo familiarità con il livello dati, proviamo a leggere una delle variabili utilizzando l'interfaccia di Google Tag Manager.

Qui proveremo a leggere l'evento utilizzando una variabile del livello dati.

Se vediamo la figura sopra, l'evento variabile contiene gtm.dom . Creeremo una variabile dall'interfaccia di GTM e vedremo come si riflette nella scheda Variabili in Google Tag Manager.

Step 1- Nell'interfaccia di Google Tag Manager, vai a Variabili. Scorri verso il basso fino alle variabili definite dall'utente. Fare clic su NUOVO.

Step 2 - Fornisci un nome a questa nuova variabile, chiamiamola varEvent.

Step 3 - Fai clic su Scegli un tipo di variabile per avviare la configurazione ...

Step 4 - Seleziona Data Layer Variable dall'elenco.

Step 5 - Quando selezioni Variabile livello dati, ti verrà richiesto di fornire il nome e la versione.

Questo nome proverrà dal livello dati effettivo di Google Tag Manager. Come accennato in precedenza, la variabile di cui tenere traccia è - event.

Step 6 - Immettere l'evento in Nome variabile livello dati.

Step 7 - Fare clic su SALVA.

Step 8 - Fare clic su Anteprima per vedere le modifiche riflesse nel debugger.

Step 9- Una volta caricata la pagina, fare clic su Finestra caricata e quindi su Variabili. Scorri fino in fondo alla sezione Variabili, vedrai varEvent, come evidenziato nello screenshot sopra.

Come si vede nello screenshot sopra, il valore sarà gtm.load.

In questo modo, è possibile ispezionare il livello dati e acquisire i valori nel livello dati come richiesto.

È il momento di esaminare alcuni scenari complessi, in cui è possibile tenere traccia degli elementi critici per l'azienda. Vedremo come creare un evento personalizzato, che non è predefinito o disponibile per impostazione predefinita.

In questo capitolo vedremo:

  • Implementazione di eventi personalizzati
  • Monitoraggio dello scorrimento del mouse

Implementazione di eventi personalizzati

Ci saranno casi in cui potresti voler creare un evento, diverso dagli eventi disponibili in GTM. Per ottenere ciò, dovremo creare un evento personalizzato, che utilizzi le variabili esistenti dal livello dati.

Considera lo scenario in cui facciamo clic sul collegamento interno creato in precedenza. Creiamo un evento personalizzato chiamato urlClick, che leggerà la variabile del livello dati gtm.elementurl.

Step 1- Per fare ciò, creiamo una variabile chiamata urlName dalla sezione Variabili. Usando il solito processo, crea la variabile.

Sopra è mostrato un esempio di variabile del livello dati: urlName.

Ora useremo questa variabile per creare il nostro evento personalizzato. L'evento personalizzato verrà utilizzato quando creiamo il trigger. Vedere lo screenshot seguente per riferimento.

Step 2- Crea un trigger per attivare l'evento che è già presente, facendo clic sul collegamento interno. In Nome evento, specifica gtm.linkClick.

Ora creiamo il tag.

Step 3- Segui la stessa procedura per creare il tag. Ecco i dettagli -

  • Tipo di tag: Universal Analytics
  • Tipo di traccia - Evento
  • Categoria - Fare clic sul collegamento
  • Azione: fare clic su

Step 4 - Per l'etichetta, utilizza l'etichetta creata di recente, urlName.

Step 5- Una volta terminato, seleziona Abilita le impostazioni di sostituzione in questo tag. Nella casella di testo ID monitoraggio, inserisci il codice di monitoraggio di Google Analytics.

Quando si seleziona un trigger, assicurarsi di selezionare il trigger creato di recente: URL su cui è stato fatto clic.

Step 6- Salva il tag. Fai clic su Anteprima per vedere le modifiche nel tuo blog.

Step 7- Ctrl + clic sul collegamento interno. Dovresti essere in grado di vedere l'evento gtm.linkClick nella casella Riepilogo. Inoltre, dovresti vedere il tag attivato come mostrato nello screenshot seguente.

In questo modo, possiamo utilizzare gli eventi esistenti per creare eventi personalizzati di nostra proprietà e avere un monitoraggio corretto per i controlli desiderati.

Monitoraggio dello scorrimento del mouse

Quando si tratta di coinvolgere gli utenti sul blog, un marketer di prodotti potrebbe voler rilevare uno scorrimento del mouse. Il rilevamento dello scorrimento del mouse è fondamentale in quanto richiederà ulteriori azioni, come mostrare un collegamento a una newsletter o attivare un popup che fornisce una sorta di sconto sul prodotto.

Utilizzando Google Tag Manager, possiamo facilmente monitorare l'evento di scorrimento. A tale scopo, dobbiamo utilizzare un codice di terze parti, che utilizzeremo durante la creazione di un tag.

Il codice è disponibile in questa posizione. Lo useremo durante la creazione di un tag.

Step 1- Crea un trigger. Chiameremo questo trigger - un trigger di scorrimento.

Fare riferimento alla seguente immagine per la configurazione del trigger.

Step 2- Configura il tipo di trigger - Pronto per DOM. Consenti l'attivazione di questo trigger - Tutti gli eventi pronti per DOM.

Step 3 - Fare clic su SALVA una volta completati i passaggi precedenti.

Ora creiamo il tag.

Step 4 - Questa volta, quando crei un tag, seleziona un diverso tipo di tracciamento come mostrato nella seguente schermata.

Step 5 - Quando viene selezionato HTML personalizzato, verrà visualizzato uno spazio per l'inserimento del codice HTML.

Step 6- Inserisci il codice copiato da questo link.

Step 7- Scorri verso il basso per configurare il trigger. Il trigger che abbiamo creato di recente (Scroll Trigger sopra), deve essere selezionato.

Step 8 - Fare clic su SALVA.

Step 9- Ora avvia il debugger GTM e aggiorna la pagina del blog. Vedrai due modifiche principali nella sezione Riepilogo e tag.

Step 10 - Ora scorri verso il basso per vedere il resto del blog, verranno attivati ​​un paio di altri eventi.

  • ScrollDistance
  • ScrollTiming

Questi eventi verranno eventualmente utilizzati per rilevare la posizione dello scorrimento del mouse e intraprendere ulteriori azioni di conseguenza.