9.3 Configurare le variabili di Google Tag Manager

Vai a https://tagmanager.google.com/ e accedi con i tuoi dati personali di accesso.

Dopo aver creato e configurato il tag Google Analytics, ora siamo pronti per configurare le variabili Google Tag Manager (come gli elementi dati utilizzati in Adobe Launch).

Nell’interfaccia utente di Google Tag Manager, passa a Variabili. Verrà visualizzato l’elenco delle variabili integrate.

Configurazione di Google Tag Manager

La prima variabile che dobbiamo aggiungere è denominata customerEmail. Quando un cliente crea un profilo sul sito web Platform Demo, collega l’indirizzo e-mail del cliente al suo profilo cliente in Platform.
Nel sito web Platform Demo, le informazioni vengono spesso memorizzate in localStorage. Per accedervi è necessario un JavaScript personalizzato per compilare la variabile Google Tag Manager.

In Variabili definite dall'utente - sezione, fai clic su Nuovo:

Configurazione di Google Tag Manager

Configurazione di Google Tag Manager

Rinomina innanzitutto "Variabile senza titolo" in un nome più descrittivo:

Variabile senza titolo
customerEmail

Quindi fai clic nella parte Configurazione per scegliere un tipo di variabile.

Configurazione di Google Tag Manager

Scegli questo.

Tipo di variabile
JavaScript personalizzato

Configurazione di Google Tag Manager

Questo è il codice personalizzato da inserire nella schermata seguente:

function() {
  var email = localStorage.getItem("email");
  return email;
}

Quindi dopo aver incollato il codice, lo schermo si presenta così.
Configurazione di Google Tag Manager

Fai clic su Salva per salvare la nuova variabile.

Configurazione di Google Tag Manager

Lo schermo sarà così.

Configurazione di Google Tag Manager

Per le variabili successive, ripeterai questo processo:

  • In Variabili definite dall'utente sezione, fai clic su Nuovo.
  • Rinomina il Untitled Variable
  • Seleziona JavaScript personalizzato come tipo di configurazione
  • Incolla il codice JavaScript
  • Fai clic su Salva per salvare la nuova variabile.

La prossima variabile sarà customerMobileNr. Quando un cliente crea un profilo sul sito web Platform Demo, collegheremo il numero di cellulare del cliente al suo profilo cliente in Platform.

In Variabili definite dall'utente - sezione, fai clic su Nuovo.

  • Rinomina Untitled Variable a customerMobileNr
  • Scegli JavaScript personalizzato come tipo di variabile
  • Incolla il codice JavaScript personalizzato:
function() {
  var mobilenr = localStorage.getItem("mobilenr");
  return mobilenr;
}

Lo schermo dovrebbe avere questo aspetto.

Configurazione di Google Tag Manager

Fai clic su Salva per salvare la nuova variabile.

Configurazione di Google Tag Manager

La prossima variabile sarà customerFirstName. Quando un cliente crea un profilo sul sito web Platform Demo, colleghiamo il nome del cliente al suo profilo cliente in Platform.

In Variabili definite dall'utente - sezione, fai clic su Nuovo.

  • Rinomina Untitled Variable a customerFirstName
  • Scegli JavaScript personalizzato come tipo di variabile
  • Incolla il codice JavaScript personalizzato:
function() {
  var firstname = localStorage.getItem("firstname");
  return firstname;
}

Lo schermo dovrebbe avere questo aspetto.

Configurazione di Google Tag Manager

Fai clic su Salva per salvare la nuova variabile.

Configurazione di Google Tag Manager

Avanti: customerLastName. Quando un cliente crea un profilo sul sito web Platform Demo, colleghiamo il cognome del cliente al suo profilo cliente in Platform.

In Variabili definite dall'utente - sezione, fai clic su Nuovo.

  • Rinomina Untitled Variable a customerLastName
  • Scegli JavaScript personalizzato come tipo di variabile
  • Incolla il codice JavaScript personalizzato:
function() {
  var lastname = localStorage.getItem("lastname");
  return lastname;
}

Lo schermo dovrebbe avere questo aspetto.

Configurazione di Google Tag Manager

Fai clic su Salva per salvare la nuova variabile.

Configurazione di Google Tag Manager

Avanti: aepTenantId. Quando un cliente crea un profilo sul sito web Platform Demo, colleghiamo il cognome del cliente al suo profilo cliente in Platform.

In Variabili definite dall'utente - sezione, fai clic su Nuovo.

  • Rinomina Untitled Variable a aepTenantId
  • Scegli JavaScript personalizzato come tipo di variabile
  • Incolla il codice JavaScript personalizzato:
function() {
  var aepTenantId = localStorage.getItem("aepTenantId");
  return aepTenantId;
}

Lo schermo dovrebbe avere questo aspetto.

Configurazione di Google Tag Manager

Fai clic su Salva per salvare la nuova variabile.

Configurazione di Google Tag Manager

Avanti: customerLoggedIn. Quando un cliente accede al sito web Platform Demo, imposta questa variabile su Sì e utilizza tale condizione in una configurazione di Launch Rule.

In Variabili definite dall'utente - sezione, fai clic su Nuovo.

  • Rinomina Untitled Variable a customerLoggedIn
  • Scegli JavaScript personalizzato come tipo di variabile
  • Incolla il codice JavaScript personalizzato:
function() {
  var loggedin = localStorage.getItem("loggedin");
  return loggedin;
}

Lo schermo dovrebbe avere questo aspetto.
Configurazione di Google Tag Manager

Fai clic su Salva per salvare la nuova variabile.

Configurazione di Google Tag Manager

Avanti: brandName. Quando selezioni un marchio da demo dal Amministratore - menu, il brandName verrà inviato a Adobe Experience Platform.

In Variabili definite dall'utente - sezione, fai clic su Nuovo.

  • Rinomina Untitled Variable a brandName
  • Scegli JavaScript personalizzato come tipo di variabile
  • Incolla il codice JavaScript personalizzato:
function() {
  var brandName = localStorage.getItem("brandName");
  return brandName;
}

Lo schermo dovrebbe avere questo aspetto.
Configurazione di Google Tag Manager

Fai clic su Salva per salvare la nuova variabile.

Configurazione di Google Tag Manager

Le variabili successive verranno create nello stesso processo, ma con un codice leggermente diverso.

La prossima variabile di cui abbiamo bisogno si chiama productProductView. Quando un cliente visualizza un prodotto, questa variabile memorizza le informazioni di visualizzazione del prodotto.

In Variabili definite dall'utente - sezione, fai clic su Nuovo.

  • Rinomina Untitled Variable a productProductView
  • Scegli JavaScript personalizzato come tipo di variabile
  • Incolla il codice JavaScript personalizzato:
function() {
  var productview = JSON.parse(localStorage.getItem("thisProductView"));
  return productview;
}

Lo schermo dovrebbe avere questo aspetto.

Configurazione di Google Tag Manager

Fai clic su Salva per salvare la nuova variabile.

Configurazione di Google Tag Manager

Viene chiamata la variabile successiva return1. Useremo questa Variabile per restituire un valore Number pari a 1 quando necessario.

In Variabili definite dall'utente - sezione, fai clic su Nuovo.

  • Rinomina Untitled Variable a return1
  • Scegli JavaScript personalizzato come tipo di variabile
  • Incolla il codice JavaScript personalizzato:
function() {
  return 1;
}

Lo schermo dovrebbe avere questo aspetto.

Configurazione di Google Tag Manager

Fai clic su Salva per salvare la nuova variabile.

Configurazione di Google Tag Manager

Se avessimo lavorato con applicazioni di Adobe, avremmo dovuto catturare l'ECID. Dal momento che vi mostriamo, che possiamo farlo anche con un Solo Google approccio alla piattaforma memorizzeremo un identificatore Google univoco, da Google Analytics. Assegneremo il valore dell'ID lato client a questa variabile.

Viene chiamata la variabile successiva gaClientId. Useremo questa variabile come chiave per tutti i dati di Google Analytics.

In Variabili definite dall'utente - sezione, fai clic su Nuovo.

  • Scegli Cookie 1st-party come tipo di variabile

Configurazione di Google Tag Manager

  • Scegli _ga Nome cookie

Configurazione di Google Tag Manager

Fai clic su Salva per salvare la nuova variabile.

Configurazione di Google Tag Manager

Avanti: pageTimeStamp. Abbiamo bisogno di una marca temporale univoca per ogni chiamata a Platform.

In Variabili definite dall'utente - sezione, fai clic su Nuovo.

  • Rinomina Untitled Variable a pageTimeStamp
  • Scegli JavaScript personalizzato come tipo di variabile
  • Incolla il codice JavaScript personalizzato:
function() {
var date = new Date();

var month = date.getUTCMonth();
var day = date.getUTCDate();
var hour = date.getUTCHours();
var min = date.getUTCMinutes();
var sec = date.getUTCSeconds();

month = (month < 9 ? "0" : "") + (month+1);
day = (day < 10 ? "0" : "") + day;
hour = (hour < 10 ? "0" : "") + hour;
min = (min < 10 ? "0" : "") + min;
sec = (sec < 10 ? "0" : "") + sec;

var str = date.getFullYear() + "-" + month + "-" + day + "T" +  hour + ":" + min + ":" + sec + ".000Z";

return str;
}

Configurazione di Google Tag Manager

Fai clic su Salva per salvare la nuova variabile.

Configurazione di Google Tag Manager

Avanti: pageHitId. È necessario un HitId univoco per ogni chiamata a Platform.

In Variabili definite dall'utente - sezione, fai clic su Nuovo.

  • Rinomina Untitled Variable a pageHitId
  • Scegli JavaScript personalizzato come tipo di variabile
  • Incolla il codice JavaScript personalizzato:
function() {
  var min = 111111111;
  var max = 9999999999999;
  var randomNumber = Math.random() * (max - min) + min;
  return String(randomNumber);
}

Configurazione di Google Tag Manager

Salva il frammento di codice e fai clic su Salva per salvare nuovamente la configurazione Variable.

Configurazione di Google Tag Manager

Ora acquisiremo alcune variabili disponibili per Google Tag Manager senza codice personalizzato facendo riferimento a oggetti JavaScript.

Per farlo, segui questi quattro passaggi:

In Variabili definite dall'utente - sezione, fai clic su Nuovo.

  • Rinomina il Untitled Variable
  • Scegli Variabile JavaScript come tipo di variabile
  • Immetti il nome della variabile JavaScript
  • Fai clic su Salva per salvare la nuova variabile.

Primo: customerLanguage. Acquisiremo la lingua preferita del cliente attingendola alle impostazioni del browser.

In Variabili definite dall'utente - sezione, fai clic su Nuovo.

  • Rinomina il Untitled Variable a customerLanguage.
  • Scegli Variabile JavaScript come tipo Variabile.

Configurazione di Google Tag Manager

  • Immetti il nome della variabile JavaScript: navigator.language.
    La schermata dovrebbe ora essere simile alla seguente:

Configurazione di Google Tag Manager

  • Fai clic su Salva per salvare la nuova variabile.

Configurazione di Google Tag Manager

Avanti: pageType. A ogni nuovo caricamento di pagina, è necessario acquisire il tipo di pagina.

In Variabili definite dall'utente - sezione, fai clic su Nuovo.

  • Rinomina il Untitled Variable a pageType.
  • Scegli Variabile JavaScript come tipo Variabile.
  • Immetti il nome della variabile JavaScript: digitalData.category.siteSection.

La schermata dovrebbe ora essere simile alla seguente:
Configurazione di Google Tag Manager

  • Fai clic su Salva per salvare la nuova variabile.

Configurazione di Google Tag Manager

Avanti: productCategory. Per ogni visualizzazione del prodotto, dobbiamo acquisire la categoria del prodotto e inviarlo a Platform.

In Variabili definite dall'utente - sezione, fai clic su Nuovo.

  • Rinomina il Untitled Variable a productCategory.
  • Scegli Variabile JavaScript come tipo Variabile.
  • Immetti il nome della variabile JavaScript: digitalData.product.category.

La schermata dovrebbe ora essere simile alla seguente:
Configurazione di Google Tag Manager

  • Fai clic su Salva per salvare la nuova variabile.

Configurazione di Google Tag Manager

Avanti: productName. Per ogni visualizzazione del prodotto, dobbiamo acquisire il nome del prodotto e inviarlo a Platform.

In Variabili definite dall'utente - sezione, fai clic su Nuovo.

  • Rinomina il Untitled Variable a productName.
  • Scegli Variabile JavaScript come tipo Variabile.
  • Immetti il nome della variabile JavaScript: digitalData.product.name.

La schermata dovrebbe ora essere simile alla seguente:
Configurazione di Google Tag Manager

  • Fai clic su Salva per salvare la nuova variabile.

Configurazione di Google Tag Manager

Avanti: productPrice. Per ogni visualizzazione del prodotto, dobbiamo acquisire il prezzo del prodotto e inviarlo a Platform.

In Variabili definite dall'utente - sezione, fai clic su Nuovo.

  • Rinomina il Untitled Variable a productPrice.
  • Scegli JavaScript personalizzato come tipo Variabile.
  • Inserisci il codice JavaScript personalizzato incollando il codice seguente:
function() {
  var price = Number(digitalData.product.price);
  return price;
}

La schermata dovrebbe ora essere simile alla seguente:
Configurazione di Google Tag Manager

  • Fai clic su Salva per salvare la nuova variabile.

Configurazione di Google Tag Manager

Avanti: productImageUrl. Per ogni visualizzazione del prodotto, dobbiamo acquisire l’URL dell’immagine del prodotto e inviarlo a Platform.

In Variabili definite dall'utente - sezione, fai clic su Nuovo.

  • Rinomina il Untitled Variable a productImageUrl.
  • Scegli Variabile JavaScript come tipo Variabile.
  • Immetti il nome della variabile JavaScript: digitalData.product.imageUrl.

La schermata dovrebbe ora essere simile alla seguente:
Configurazione di Google Tag Manager

  • Fai clic su Salva per salvare la nuova variabile.

Configurazione di Google Tag Manager

Avanti: productInteraction. Per ogni visualizzazione del prodotto, dobbiamo acquisire il tipo di interazione (Visualizzazione, Aggiungi al carrello, Acquisto, ecc.) e inviarlo a Platform.

In Variabili definite dall'utente - sezione, fai clic su Nuovo.

  • Rinomina il Untitled Variable a productInteraction.
  • Scegli Variabile JavaScript come tipo Variabile.
  • Immetti il nome della variabile JavaScript: digitalData.product.interaction.

La schermata dovrebbe ora essere simile alla seguente:
Configurazione di Google Tag Manager

  • Fai clic su Salva per salvare la nuova variabile.

Configurazione di Google Tag Manager

Avanti: pageUserAgent. Per ogni visualizzazione di pagina, dobbiamo acquisire il tipo di dispositivo utente e il sistema operativo e inviarlo a Platform. Usiamo l'Agente utente per ricavare queste informazioni. Maggiori informazioni sull'agente utente sono disponibili qui: https://en.wikipedia.org/wiki/User_agent

In Variabili definite dall'utente - sezione, fai clic su Nuovo.

  • Rinomina il Untitled Variable a pageUserAgent.
  • Scegli Variabile JavaScript come tipo Variabile.
  • Immetti il nome della variabile JavaScript: navigator.userAgent.

La schermata dovrebbe ora essere simile alla seguente:
Configurazione di Google Tag Manager

  • Fai clic su Salva per salvare la nuova variabile.

Configurazione di Google Tag Manager

Quasi fatto, ora è il momento di : pageName. A ogni nuovo caricamento di pagina, è necessario acquisire il nome della pagina e inviarla ad AA, AAM e Platform.

In Variabili definite dall'utente - sezione, fai clic su Nuovo.

  • Rinomina il Untitled Variable a pageName.
  • Scegli Variabile JavaScript come tipo Variabile.
  • Immetti il nome della variabile JavaScript: document.title.

La schermata dovrebbe ora essere simile alla seguente:
Configurazione di Google Tag Manager

  • Fai clic su Salva per salvare la nuova variabile.

Configurazione di Google Tag Manager

E quello finale: pageUrl. A ogni nuovo caricamento di pagina, dobbiamo acquisire l’URL per inviarlo ad altre soluzioni.
L’URL della pagina è già una variabile incorporata in Google Tag Manager, pertanto non è necessario definirlo. Ma per coerenza con altre informazioni su Platform, definiremo comunque pageUrl .

In Variabili definite dall'utente - sezione, fai clic su Nuovo.

  • Rinomina il Untitled Variable a pageUrl.
  • Scegli URL come tipo Variabile.

Configurazione di Google Tag Manager

La schermata dovrebbe ora essere simile alla seguente:
Configurazione di Google Tag Manager

  • Fai clic su Salva per salvare la nuova variabile.

Configurazione di Google Tag Manager

Hai completato la configurazione di tutte le variabili Google Tag Manager necessarie.

Passaggio successivo: 9.4 Recupera set di dati della piattaforma

Torna al modulo 9

Torna a tutti i moduli

In questa pagina