Modo propio: Carga secuencias de comandos de Google a través del etiquetado del servidor

Este artículo está dirigido a los desarrolladores que usan el etiquetado del servidor y desean publicar secuencias de comandos de Google desde sus propios servidores.

El etiquetado del servidor te permite cargar secuencias de comandos de Google, como gtm.js o gtag.js, directamente desde tu servidor de etiquetas en lugar de hacerlo desde los servidores de Google. Esto te permite publicar datos en un contexto de origen.

En esta guía, se da por sentado que ya hiciste lo siguiente:

Para comenzar, elige tu opción de implementación.

Paso 1: Configura el cliente

Para establecer un contexto propio entre tu contenedor web y tu servidor de etiquetado, las secuencias de comandos de Google se deben cargar a través de tu servidor.

Para cargar secuencias de comandos de Google a través de tu contenedor de servidor, sigue estos pasos:

  1. Abrir Google Tag Manager
  2. En el contenedor del servidor, haz clic en Clientes.
  3. Haz clic en Nuevo.

  4. Selecciona el tipo de cliente Google Tag Manager: Contenedor web. Diálogo Elige el tipo de cliente con el cliente de contenedor web de Tag Manager destacado

  5. En Configuración del cliente, haz lo siguiente:

    • Agregar ID de contenedor: Ingresa el ID del contenedor web de Tag Manager que usarás en tu sitio web.
    • Publicar automáticamente todas las secuencias de comandos de Google dependientes: Cuando está habilitada (configuración predeterminada), el servidor de etiquetas publica automáticamente las secuencias de comandos que necesita la secuencia de comandos de Google raíz. Esto elimina la necesidad de incluir en la lista de entidades permitidas cada contenedor que requiere la secuencia de comandos de Google. Si solo deseas publicar el contenedor inicial desde el servidor de etiquetado, anula la selección de esta opción.
    • Habilita la configuración específica de la región: Usa esta opción para activar ciertas etiquetas según la ubicación del usuario. Obtén más información.

    Captura de pantalla del cliente del contenedor web de Tag Manager

  6. Asigna un nombre al cliente y haz clic en Guardar.

  7. Publica el espacio de trabajo.

Paso 2: Actualiza el dominio de origen de la secuencia de comandos

De forma predeterminada, Tag Manager o gtag.js cargan sus dependencias desde servidores de Google, como https://example.com/metrics. Debes actualizar la URL de la secuencia de comandos en tu sitio web para cargar dependencias a través de tu propio servidor.

Para cargar el código de GTM a través de tu contenedor de servidor, sigue estos pasos:

  1. Busca el código de Tag Manager existente en la página.

  2. Reemplaza la cadena https://example.com/metrics por el nombre de dominio de tu servidor de etiquetas en <head> y <body> del código de instalación de Google Tag Manager.

    • Head:
    <!-- 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://example.com/metrics/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXX');</script>
<!-- End Google Tag Manager -->
    • Cuerpo:
    <!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://example.com/metrics/ns.html?id=TAG_ID"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

Paso 3: Verifica la fuente de tus secuencias de comandos

En las siguientes instrucciones, se muestra cómo realizar la prueba con Google Chrome. Puedes usar el navegador que quieras, pero los pasos pueden variar.

Para probar si el contenedor del servidor carga las dependencias, haz lo siguiente:

  1. Abre tu sitio web en una pestaña nueva del navegador.
  2. Abre las herramientas para desarrolladores del navegador. En Google Chrome, puedes hacer clic con el botón derecho en cualquier lugar de la página y seleccionar Inspeccionar.

  3. En las herramientas para desarrolladores, abre la pestaña Sources. En esta ventana, se muestran todas las dependencias que se cargaron cuando abriste el sitio web.

    • ✅ Tu implementación es correcta si gtm.js se carga desde la fuente que especificaste.

    Captura de pantalla de las herramientas para desarrolladores con tu propio servidor como fuente de las secuencias de comandos de Google

    • ❌ Si la pestaña Sources muestra www.googletagmanager.com como la fuente de gtm.js, las dependencias aún se cargan desde los servidores de Google.

    Captura de pantalla de las herramientas para desarrolladores con www.googletagmanager.com como la fuente de las secuencias de comandos de Google

    • Verifica si modificaste la URL de origen en tu código. Consulta el paso 2.
    • Verifica si el código está publicado.

Próximos pasos

Si utilizas el modo de consentimiento, puedes configurar el comportamiento de las etiquetas específico de la región para tener aún más control.