Guida alla configurazione di AMP e Tag Manager

Il progetto Accelerated Mobile Pages (AMP) è una piattaforma web open source che aiuta a migliorare le prestazioni dei contenuti web. AMP include il supporto integrato per Google Tag Manager. Questo documento descrive il modo consigliato per configurare Google Tag Manager sulle pagine AMP.

Per installare Tag Manager per AMP:

Crea un contenitore AMP in Tag Manager.
Aggiungi lo snippet Tag Manager alle pagine AMP.
Configura i tag nel contenitore Tag Manager ed esegui la pubblicazione.

Creare un contenitore AMP

Tag Manager ha un contenitore di tipo AMP. Crea un nuovo contenitore AMP per il tuo progetto:

Nella schermata Account, fai clic su Altre azioni () per l'account che vuoi utilizzare. Seleziona Crea contenitore.
Assegna un nome al contenitore. Utilizza un nome descrittivo come "example.com - notizie - AMP".
In Dove utilizzare il contenitore, seleziona AMP.
Fai clic su Crea.

Il contenitore è pronto. Il prossimo passo è installare il codice Tag Manager sulle pagine AMP.

Tag Manager fornirà informazioni su come installare al meglio lo snippet di codice. Per ulteriori indicazioni, leggi la sezione successiva.

Aggiungere lo snippet Tag Manager

Dopo aver creato il nuovo contenitore AMP, verrà visualizzata la schermata Installa Google Tag Manager. Tag Manager fornisce due snippet di codice. Copiali e incollali nelle pagine AMP.

Nota: per accedere agli snippet di codice in un secondo momento, fai clic sul numero di ID del contenitore nella parte superiore della pagina di panoramica dello spazio di lavoro oppure fai clic su Amministratore e poi su Installa Google Tag Manager.

Il primo snippet aggiunge il componente amp-analytics alla pagina AMP. Questo codice è posizionato alla fine della sezione <head> della pagina e dovrebbe comparire una sola volta.

<script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>

Importante: aggiungi questo codice alla pagina solo se non esiste già e assicurati che venga visualizzato solo una volta per pagina.

Il secondo snippet attiva Tag Manager da amp-analytics. Inserisci questo codice subito dopo l'elemento <body> di apertura. Sostituisci GTM-CONTAINER_ID con l'ID contenitore di Tag Manager oppure copia e incolla l'intero snippet dall'interfaccia utente di Tag Manager.

<amp-analytics config="https://www.googletagmanager.com/amp.json?id=GTM-CONTAINER_ID" data-credentials="include"></amp-analytics>

Configurare il contenitore ed eseguire la pubblicazione

Una volta installato correttamente lo snippet del contenitore nelle tue pagine, queste potranno attivare i tag distribuiti da Tag Manager. Il prossimo passo è creare configurazioni di tag e pubblicare il contenitore.

Per creare un nuovo tag:

Fai clic su Tag Nuovo.
Fai clic su Configurazione tag e seleziona il tipo di tag dall'elenco di tag AMP supportati.
Configura il tag con le informazioni fornite dal tuo fornitore di tag.
Fai clic su Attivazione e aggiungi una o più condizioni di evento che attiveranno il tag.
Assegna un nome all'attivatore e fai clic su Salva.

Ripeti questi passaggi per tutte le configurazioni di tag aggiuntive. Quando la configurazione del contenitore è pronta, pubblica il contenitore in modo che le modifiche abbiano effetto.

Variabili di pagina

Tag Manager può acquisire le variabili AMP e utilizzarle nelle configurazioni di tag e attivatori. Ad esempio, una pagina in cui si vendono calzature potrebbe avere delle variabili che descrivono le proprietà di una determinata scarpa. Questi valori possono essere utilizzati per creare variabili di Tag Manager:

<amp-analytics config="https://www.googletagmanager.com/amp.json?id=Tag Manager-XXXXXX;Tag Manager.url=SOURCE_URL" data-credentials="include">
  <script type="application/json ">
      {
          "vars" : {
              "type": "shoes",
              "color": "red"
          }
      }
  </script>
</amp-analytics>

Per creare in Tag Manager una variabile definita dall'utente che acquisisca la variabile del colore nel codice precedente:

Fai clic su Variabili.
In Variabili definite dall'utente, fai clic su Nuova.
Fai clic su Configurazione variabile e seleziona Variabile AMP.
Nel campo Nome variabile AMP, inserisci il nome del campo, ad esempio "colore".
Assegna alla variabile un nome descrittivo, ad esempio "Variabile AMP - colore".
Fai clic su Salva.

Tag AMP con supporto per Tag Manager

È stato utile?

Come possiamo migliorare l'articolo?