15%

Ahorra 15%<\/span> en todos los servicios de hosting

Pon a prueba tus habilidades y obtén Descuento<\/span> en cualquier plan de hosting

Usa el código:

Skills
Comenzar
21.10.2024
1 +1

Cómo configurar Google Tag Manager y encontrar tu ID de GTM

Google Tag Manager (GTM) es un sistema gratuito de gestión de etiquetas (TMS) de Google que te permite implementar y gestionar fragmentos de seguimiento JavaScript — llamados etiquetas — en tu sitio web a través de una interfaz web centralizada, sin tocar directamente el código fuente de tu sitio. Tu ID de contenedor GTM (con el formato GTM-XXXXXXX) es el identificador único que vincula el fragmento de contenedor instalado en tu sitio web con tu cuenta GTM, y es necesario cada vez que integras GTM con plataformas externas como Google Analytics 4, Meta Pixel, o cualquier consumidor de capa de datos de terceros.

Esta guía cubre el proceso de configuración completo de principio a fin: creación de cuenta y contenedor, instalación de fragmentos en diferentes plataformas, localización de tu ID de contenedor, y los pasos críticos de verificación post-instalación que la mayoría de los tutoriales omiten.

Qué Es Google Tag Manager y Por Qué Es Importante para la Arquitectura del Sitio

Antes de tocar cualquier configuración, es útil entender qué hace GTM realmente a nivel de infraestructura. Cuando un navegador carga tu página, el fragmento de contenedor GTM envía una solicitud a https://www.googletagmanager.com/gtm.js?id=GTM-XXXXXXX. Los servidores de Google devuelven un paquete JavaScript compilado que contiene solo las etiquetas, activadores y variables que has publicado en tu versión de contenedor actual. Esto significa:

  • No hay scripts de seguimiento codificados dispersos por tus plantillas HTML.
  • El disparo de etiquetas es condicional — los activadores evalúan eventos DOM, patrones de URL o JavaScript personalizado antes de que se ejecute una etiqueta.
  • El control de versiones está integrado — cada versión de contenedor publicada se guarda y puedes revertir instantáneamente.
  • Un solo contenedor puede contener cientos de etiquetas de diferentes proveedores, todas gestionadas desde un único panel.

Esta arquitectura es especialmente valiosa cuando tu sitio se ejecuta en un entorno de Alojamiento VPS donde controlas la pila completa, porque desacopla completamente la instrumentación de marketing de tu pipeline de implementación.

Paso 1: Crear una Cuenta y Contenedor en Google Tag Manager

Cuenta vs. Contenedor — Entendiendo la Jerarquía

GTM utiliza una jerarquía de dos niveles:

  • Cuenta: Normalmente representa tu empresa u organización. Una cuenta por negocio es la práctica estándar.
  • Contenedor: Representa una unidad implementable única — generalmente un sitio web, una aplicación móvil o una propiedad AMP. Una sola cuenta puede contener múltiples contenedores.

Confundir estos dos niveles es un error común. Si gestionas el seguimiento para shop.example.com y blog.example.com como propiedades separadas, deben ser contenedores separados bajo la misma cuenta — no cuentas separadas.

Creación de la Cuenta

  1. Navega a tagmanager.google.com e inicia sesión con la cuenta de Google que posee o tiene acceso de administrador a tu propiedad de Google Analytics.
  2. Haz clic en Crear cuenta.
  3. Introduce tu Nombre de cuenta (el nombre de tu empresa o marca).
  4. Selecciona tu País.
  5. Deja marcada la opción Compartir datos de forma anónima con Google o desmárcala según los requisitos de tu política de privacidad.

Configuración del Contenedor

Dentro del mismo flujo de creación:

  1. Introduce un Nombre de contenedor — usa el dominio completo (p. ej., example.com) para mayor claridad.
  2. En Plataforma de destino, selecciona la opción apropiada:
Opción de PlataformaCaso de Uso
WebSitios web estándar HTML/JavaScript
iOSAplicaciones iOS nativas que usan Firebase SDK
AndroidAplicaciones Android nativas que usan Firebase SDK
AMPAccelerated Mobile Pages
ServerEtiquetado del lado del servidor (contenedor de servidor GTM)

Para la mayoría de los proyectos web, selecciona Web.

  1. Haz clic en Crear y acepta los Términos de Servicio de Google Tag Manager. Si operas bajo la jurisdicción del GDPR, lee la Enmienda de Procesamiento de Datos antes de aceptar.

Tras aceptar, GTM presenta inmediatamente tus dos fragmentos de código de contenedor. No cierres esta ventana antes de copiarlos.

Paso 2: Instalar el Fragmento de Contenedor GTM en Tu Sitio Web

GTM requiere dos fragmentos de código separados colocados en ubicaciones específicas. Colocarlos incorrectamente es uno de los errores de implementación más comunes y puede provocar que las etiquetas se disparen tarde, pierdan vistas de página o fallen completamente en ciertos navegadores.

Los Dos Fragmentos Requeridos

Fragmento 1 — Ubicación <head> (JavaScript):

<!-- 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-XXXXXXX');</script>
<!-- End Google Tag Manager -->

Coloca esto lo más alto posible en el <head> — idealmente inmediatamente después de la etiqueta de apertura <head>.

Fragmento 2 — Ubicación <body> (alternativa noscript):

<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX"
height="0" width="0"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

Coloca esto inmediatamente después de la etiqueta de apertura <body>. Este iframe <noscript> es la alternativa para navegadores con JavaScript desactivado — garantiza que el disparo básico de etiquetas siga ocurriendo mediante la carga de un píxel iframe.

Nota crítica: Reemplaza GTM-XXXXXXX con tu ID de contenedor real en ambos fragmentos.

Instalación en WordPress

WordPress es el CMS más común para implementaciones GTM. Tienes tres métodos:

Método A — functions.php del tema (directo, sin dependencia de plugin):

// Add to your child theme's functions.php
function add_gtm_head() {
    echo "<!-- 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-XXXXXXX');</script><!-- End Google Tag Manager -->";
}
add_action('wp_head', 'add_gtm_head', 1);

function add_gtm_body() {
    echo '<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX" height="0" width="0"></iframe></noscript>';
}
add_action('wp_body_open', 'add_gtm_body', 1);

Método B — Plugin (Insert Headers and Footers o GTM4WP): Instala el plugin, pega el Fragmento 1 en el campo de encabezado y el Fragmento 2 en el campo de cuerpo/después del cuerpo. El plugin GTM4WP es preferible a los plugins genéricos de encabezado/pie de página porque también envía datos específicos de WordPress (tipo de publicación, autor, datos del carrito de WooCommerce) al dataLayer automáticamente.

Método C — Edición directa de plantilla: Edita header.php en tu tema para insertar ambos fragmentos en las posiciones correctas. Usa siempre un tema hijo — editar directamente un tema padre significa que tus cambios se borrarán en la próxima actualización del tema.

Instalación en Shopify

Shopify restringe el acceso directo a <head> al archivo theme.liquid. Navega a Tienda en línea > Temas > Editar código > Diseño > theme.liquid e inserta ambos fragmentos en las posiciones apropiadas. Ten en cuenta que las páginas de pago de Shopify requieren un plan Shopify Plus para añadir scripts personalizados.

Instalación en un Sitio HTML Personalizado/Renderizado en el Servidor

Si gestionas una aplicación personalizada en un Servidor Dedicado o VPS, edita directamente tu plantilla HTML base. Para frameworks renderizados en el servidor (Node.js/Express, Django, Laravel), añade los fragmentos a tu archivo de plantilla de diseño base.

Para una aplicación Node.js/Express que usa plantillas EJS:

# Locate your base layout template
find /var/www/myapp/views -name "layout.ejs"

Luego edita el archivo para insertar ambos fragmentos GTM en las posiciones correctas dentro del <head> e inmediatamente después de <body>.

Consideraciones sobre la Política de Seguridad de Contenido

Si tu sitio aplica un encabezado de Política de Seguridad de Contenido (CSP) — lo cual debería hacerse en cualquier servidor de producción reforzado — debes incluir en la lista blanca los dominios de GTM. Añade lo siguiente a tus directivas CSP:

script-src 'self' https://www.googletagmanager.com;
img-src 'self' https://www.googletagmanager.com;
frame-src https://www.googletagmanager.com;

No actualizar tu CSP bloqueará silenciosamente la carga de GTM, y no aparecerá ningún error en la propia interfaz de GTM — solo en la consola del navegador.

Paso 3: Encontrar Tu ID de Google Tag Manager

Tu ID de contenedor GTM siempre tiene el formato GTM- seguido de una cadena alfanumérica (p. ej., GTM-K2F9XP3). Hay tres formas fiables de localizarlo.

Método 1 — Panel del Contenedor (Método Principal)

  1. Inicia sesión en tagmanager.google.com.
  2. En la página de resumen de Cuentas, verás todas tus cuentas y sus contenedores asociados listados en tarjetas.
  3. El ID del contenedor (GTM-XXXXXXX) se muestra directamente debajo del nombre del contenedor en cada tarjeta — visible sin necesidad de hacer clic en el contenedor.

Método 2 — Panel de Administración del Contenedor

  1. Abre el contenedor que deseas.
  2. Haz clic en Administrador en la barra de navegación superior.
  3. En la columna Contenedor, haz clic en Configuración del contenedor.
  4. El campo ID del contenedor en la parte superior de esta página muestra tu ID GTM completo.

Método 3 — Fuente de la Página Instalada

Si GTM ya está instalado en tu sitio y necesitas recuperar el ID sin iniciar sesión en GTM:

curl -s https://example.com | grep -o 'GTM-[A-Z0-9]*'

Este comando obtiene el código fuente de tu página y extrae cualquier cadena de ID de contenedor GTM usando un patrón regex — útil para auditar sitios de terceros o verificar qué contenedor está realmente activo.

Paso 4: Verificar la Instalación

Omitir la verificación es el error más costoso en las implementaciones de GTM. Un fragmento mal colocado, un bloqueo CSP o una anulación del tema pueden romper silenciosamente toda tu configuración de seguimiento.

Modo Vista Previa de GTM (Recomendado)

  1. Dentro de tu contenedor, haz clic en Vista previa en la esquina superior derecha.
  2. Introduce la URL de tu sitio web y haz clic en Conectar.
  3. Se abre una nueva pestaña del navegador con tu sitio y el panel de Tag Assistant adjunto.
  4. El panel muestra cada etiqueta que se disparó al cargar la página, qué activadores las activaron y el estado completo de dataLayer.

Si el contenedor se carga correctamente, verás gtm.js listado como una etiqueta disparada y gtm.load como un evento completado en el panel de resumen.

Extensión Chrome Google Tag Assistant

Instala la extensión Tag Assistant Legacy o usa la nueva extensión Tag Assistant Companion. Navega a tu sitio y la extensión confirmará si GTM está detectado, mostrará el ID de contenedor encontrado y señalará cualquier error de implementación (como el fragmento colocado en la ubicación incorrecta o disparándose varias veces).

Verificación Manual en la Consola del Navegador

Abre Chrome DevTools (F12), ve a la pestaña Red, filtra por gtm.js y recarga la página. Deberías ver una respuesta 200 exitosa desde www.googletagmanager.com. Si ves una solicitud bloqueada o fallida, comprueba tus encabezados CSP y las reglas del firewall del servidor.

# Check response headers from GTM's script endpoint
curl -I "https://www.googletagmanager.com/gtm.js?id=GTM-XXXXXXX"

Paso 5: Usar Tu ID GTM con Plataformas de Terceros

Una vez verificado tu contenedor, el ID GTM se utiliza en varios contextos de integración:

Google Analytics 4

No instales el fragmento gtag.js de GA4 directamente en la página si GTM está presente. En su lugar, crea una Etiqueta de Google (anteriormente Etiqueta de Configuración GA4) dentro de GTM, introduce tu ID de Medición GA4 (G-XXXXXXXXXX) y establece el activador en Todas las páginas. Esto mantiene todo el seguimiento centralizado en GTM.

Meta (Facebook) Pixel

Añade una etiqueta HTML personalizada en GTM que contenga el código base de Meta Pixel. Usa las variables integradas de GTM ({{Page URL}}, {{Click URL}}) para rellenar los parámetros de eventos dinámicamente en lugar de codificarlos de forma fija.

Plugins de WordPress que Solicitan el ID GTM

Plugins como Rank Math, MonsterInsights o WooCommerce Google Analytics pueden solicitar tu ID GTM directamente. Si ya has instalado el fragmento GTM manualmente o mediante GTM4WP, no introduzcas tu ID GTM también en estos plugins — esto hará que el contenedor se cargue dos veces, duplicando todos los disparos de etiquetas e inflando tus datos de análisis.

GTM del Lado del Servidor (Avanzado)

Para sitios de alto tráfico o implementaciones sensibles a la privacidad, GTM admite un contenedor del lado del servidor que se ejecuta en tu propia infraestructura. En lugar de que el navegador cargue etiquetas directamente desde los CDN de los proveedores, todas las solicitudes van primero a tu servidor. Esto mejora el rendimiento de carga de la página, evita los bloqueadores de anuncios y te da control total sobre qué datos salen de tu infraestructura. Ejecutar un contenedor GTM del lado del servidor es muy adecuado para un VPS con cPanel o un VPS sin configuración previa donde puedes configurar Node.js o un servidor de etiquetado en contenedor.

Comparación de Tipos de Contenedor GTM

Tipo de ContenedorUbicación de ImplementaciónCaso de Uso PrincipalRequiere Infraestructura de Servidor
WebNavegador (lado del cliente)Seguimiento estándar de sitios webNo
iOS / AndroidAplicación móvilSeguimiento de eventos de aplicaciones mediante FirebaseNo
AMPPáginas AMPSeguimiento en Accelerated Mobile PagesNo
ServerTu servidorSeguimiento de alto rendimiento con privacidad prioritaria

Errores Comunes y Casos Especiales

Contenedores con doble disparo: Si tu tema de WordPress ya incluye GTM mediante un fragmento codificado de forma fija y también activas un plugin que inyecta GTM, ambos se dispararán. Audita siempre el código fuente de tu página con curl -s https://example.com | grep -c 'GTM-' para contar las ocurrencias.

Entorno de contenedor incorrecto: GTM admite múltiples Entornos (Activo, Desarrollo, Staging). Si un desarrollador comparte un enlace de vista previa usando un token de entorno no activo, las etiquetas pueden comportarse de manera diferente que en producción. Prueba siempre contra el entorno Activo antes de la aprobación final.

Orden de inicialización del dataLayer: Si tu sitio envía datos a window.dataLayer antes de que se cargue el fragmento GTM, esos envíos se pierden. El array dataLayer debe inicializarse antes del fragmento GTM, o el propio fragmento gestiona la inicialización — pero cualquier envío que ocurra antes de que se ejecute el fragmento no se captura. Esta es una fuente frecuente de datos de comercio electrónico faltantes en páginas de carga lenta.

Requisito HTTPS: El gtm.js de GTM siempre se sirve a través de HTTPS. Si tu sitio todavía funciona sobre HTTP, la política de contenido mixto en los navegadores modernos bloqueará el script GTM. Asegúrate de que tu sitio tenga un certificado SSL válido — los Certificados SSL son un requisito previo para cualquier implementación GTM en producción.

Secuenciación de etiquetas: Cuando múltiples etiquetas se disparan en el mismo activador, el orden de ejecución no está garantizado a menos que configures explícitamente la Secuenciación de etiquetas (Etiqueta de configuración / Etiqueta de limpieza) en la configuración avanzada de etiquetas de GTM.

Matriz de Decisión Práctica

Usa esta lista de verificación antes de considerar tu configuración GTM lista para producción:

  • [ ] El fragmento de contenedor está presente en <head> e inmediatamente después de <body> en cada página, incluidas las páginas generadas dinámicamente.
  • [ ] El ID GTM aparece exactamente una vez por página — confirmado mediante curl o inspección del código fuente del navegador.
  • [ ] Los encabezados CSP incluyen en la lista blanca www.googletagmanager.com para script-src, img-src y frame-src.
  • [ ] El Modo Vista Previa confirma que el contenedor se carga y gtm.js se dispara al cargar la página.
  • [ ] No existen fragmentos duplicados de GA4 u otros proveedores fuera de GTM.
  • [ ] dataLayer se inicializa antes del fragmento GTM en el código fuente HTML.
  • [ ] Si usas WordPress, un tema hijo o un plugin dedicado (no el tema padre) contiene el fragmento.
  • [ ] Las reglas del firewall del servidor permiten solicitudes salientes a www.googletagmanager.com:443.
  • [ ] Para comercio electrónico: los envíos de dataLayer para los eventos purchase, add_to_cart y view_item se verifican en el Modo Vista Previa antes de publicar.
  • [ ] El contenedor está publicado — los cambios no publicados solo existen en el espacio de trabajo y no afectan al sitio activo.

Si tu entorno de alojamiento es un plan de Alojamiento Web Compartido gestionado sin acceso directo al servidor, céntrate en los métodos de instalación a nivel de CMS (plugin o archivo de tema) y confía en el Modo Vista Previa de GTM para la verificación en lugar de los comandos curl a nivel de servidor.

Preguntas Frecuentes

¿Qué es un ID de contenedor GTM y dónde se usa?

Un ID de contenedor GTM es un identificador único con el formato GTM-XXXXXXX que vincula el fragmento JavaScript instalado en tu sitio web con tu contenedor GTM específico. Se usa en el código del fragmento de contenedor, en las integraciones con plataformas de terceros y en la propia interfaz de administración de GTM para identificar qué configuración de etiquetas del contenedor debe cargarse.

¿Puedo usar el mismo contenedor GTM en múltiples dominios?

Técnicamente sí — el mismo fragmento puede colocarse en múltiples dominios — pero no se recomienda. Las etiquetas y activadores configurados para la estructura de URL de un dominio producirán datos poco fiables en un dominio diferente. El enfoque correcto es crear un contenedor separado por dominio y usar la configuración de seguimiento entre dominios dentro de GA4 si necesitas rastrear los recorridos de los usuarios en ambos.

¿Por qué mi contenedor GTM no se dispara aunque el fragmento está instalado?

Las causas más comunes son: una Política de Seguridad de Contenido que bloquea www.googletagmanager.com, el fragmento colocado dentro de un comentario condicional o una parte de plantilla cargada de forma asíncrona, un plugin de caché de WordPress que sirve una página en caché que se construyó antes de que se añadiera el fragmento, o el contenedor sin ninguna versión publicada. Comprueba la consola del navegador en busca de violaciones CSP y usa el Modo Vista Previa de GTM para aislar el problema.

¿Cuál es la diferencia entre el Modo Vista Previa de GTM y Tag Assistant?

El Modo Vista Previa de GTM es una función integrada de GTM que conecta una sesión de depuración directamente a tu contenedor, mostrando el disparo de etiquetas en tiempo real, la evaluación de activadores y el estado de dataLayer para tu sesión de navegador específica. Tag Assistant es una extensión de Chrome que proporciona una superposición más ligera que muestra qué etiquetas de Google (GTM, GA4, Ads) se detectan en una página y señala errores básicos de implementación. Para una depuración profunda, el Modo Vista Previa es la referencia; Tag Assistant es útil para comprobaciones rápidas superficiales.

¿Afecta Google Tag Manager al rendimiento del sitio web o a la velocidad de carga de la página?

El propio fragmento GTM se carga de forma asíncrona, por lo que no bloquea el análisis HTML ni los recursos que bloquean el renderizado. Sin embargo, las etiquetas disparadas por GTM — en particular las etiquetas HTML personalizadas síncronas o los scripts pesados de terceros — pueden afectar significativamente al tiempo de carga de la página. Audita regularmente las etiquetas de tu contenedor, usa los controles de prioridad y secuenciación de disparo de etiquetas integrados en GTM, y considera el GTM del lado del servidor para sitios de alto tráfico donde la sobrecarga de scripts del lado del cliente es una preocupación medible.

15%

Ahorra 15%<\/span> en todos los servicios de hosting

Pon a prueba tus habilidades y obtén Descuento<\/span> en cualquier plan de hosting

Usa el código:

Skills
Comenzar