Solución:
Originalmente intenté agregar el GTM usando Glue para Yoast SEO y realizó un seguimiento de las páginas. Sin embargo, eso resultó en 2 errores de validación de AMP:
La forma correcta de implementar la etiqueta a partir de ahora es a través de amp-pixel o amp-analytics. Yo mismo utilicé la etiqueta amp-analytics. Primero agregarías esto en la cabeza:
<script async custom-element="amp-analytics"
src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
Y luego el código de seguimiento va en el cuerpo dentro de esta etiqueta usando JSON:
<amp-analytics type="googleanalytics" id="analytics1"></amp-analytics>
Los detalles completos se pueden encontrar aquí:
Agregar Analytics a sus páginas AMP
Google Tag Manager ahora agregó compatibilidad con AMP. Todo lo que necesitas es
- crear un contenedor GTM de tipo “AMP”
-
Incluya el siguiente código en
<head><!-- AMP Analytics --><script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script> -
Incluya el siguiente código en
<body><!-- Google Tag Manager --> <amp-analytics config="https://www.googletagmanager.com/amp.json?id=GTM-XXXXXX>m.url=SOURCE_URL" data-credentials="include"></amp-analytics>
Encuentre más información sobre eso en el blog de Simo Ahava http://www.simoahava.com/analytics/accelerated-mobile-pages-via-google-tag-manager
No solo hay un soporte de Tag Manager, sino que esa es la forma principal admitida para análisis desde hace un tiempo. La forma anterior publicada por Andrea Rapanaro en 2016 usaba identificadores de propiedad de GA. El actual está descrito por https://developers.google.com/analytics/devguides/collection/amp-analytics, también citado por dasickle.
Aquí está mi opinión:
-
En la sección de encabezado del documento HTML:
<script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js" crossorigin="anonymous"></script> -
En mi
_config.yml:gtag: "GTM-NPS2Q4K"(https://gitlab.com/MrCsabaToth/mrcsabatoth.gitlab.io/-/blob/master/_config.yml#L36). Este es Jekyll, si usa otro generador de sitio estático / SSG / marco, necesitará usar el método de configuración del marco en particular. -
La configuración real (la etiqueta G es interpolada por Jekyll, simplemente puede reemplazarla usted mismo o usar la forma de interpolación de su SSG preferido):
<amp-analytics type="gtag" data-credentials="include">
<script type="application/json">
{
"vars" : {
"gtag_id": "{{ site.ga }}",
"config" : {
"{{ site.ga }}": { "groups": "default" }
}
}
}
</script>
</amp-analytics>
Esto incluso funciona con GDPR si agrega data-block-on-consent al amp-analytics Elemento HTML como en https://gitlab.com/MrCsabaToth/mrcsabatoth.gitlab.io/-/blob/master/_layouts/default.html#L10
En realidad, esto podría ser extraño para aquellos que solo tienen Google Analytics ahora y no tienen la configuración de Google Tag Manager. Asegúrese de establecer un espacio de trabajo predeterminado en Google Tag Manager; de lo contrario, su gtag no funcionará. Eso lo aprendí de la manera más difícil.