Cómo agregar Google Tag Manager a tu sitio de WordPress sin utilizar un plugin

/ Bootcamp WordPress / Por

A continuación, te explicaré cómo puedes agregar Google Tag Manager a tu sitio de WordPress sin utilizar un plugin, mediante el código.

Antes de comenzar, es importante destacar que modificar el código de tu sitio web requiere ciertos conocimientos básicos de HTML y CSS. Si no te sientes cómodo con este proceso, te recomendaría utilizar un plugin de WordPress para facilitar la implementación de Google Tag Manager en tu sitio.

Aquí tienes los pasos para agregar Google Tag Manager a WordPress mediante código:

Paso 1: Obtén el código de Google Tag Manager

  1. Accede a tu cuenta de Google Tag Manager (https://tagmanager.google.com/) y crea un nuevo contenedor para tu sitio web si aún no lo has hecho.
  2. Haz clic en «Administrar contenedores» en la parte superior de la página y selecciona tu contenedor.
  3. Haz clic en «Instalar código» en la parte superior derecha.
  4. Copia el fragmento de código que aparece en la sección «Google Tag Manager Container» (GTM-XXXXXX).

Paso 2: Accede a los archivos de tu tema

  1. Accede al administrador de archivos de tu hosting o utiliza un cliente de FTP como FileZilla para conectarte a tu servidor.
  2. Navega hasta la carpeta de tu tema activo en «wp-content/themes/tu-tema-activo».

Paso 3: Agrega el código de Google Tag Manager

  1. En la carpeta de tu tema, busca el archivo «header.php». Este archivo generalmente se encuentra en la raíz del tema o en una subcarpeta llamada «partials» o «includes».
  2. Haz una copia de seguridad del archivo «header.php» antes de modificarlo, por si necesitas revertir los cambios.
  3. Abre el archivo «header.php» con un editor de texto y localiza la etiqueta <head>.
  4. Justo antes de la etiqueta de cierre </head>, pega el fragmento de código de Google Tag Manager que copiaste previamente.
  5. Guarda los cambios y cierra el archivo «header.php».

Aquí tienes un ejemplo de cómo se vería el código que debes agregar al archivo «header.php» de tu tema de WordPress:

<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
    <meta charset="<?php bloginfo('charset'); ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <!-- Aquí empieza el código de Google Tag Manager -->
    <!-- Reemplaza 'GTM-XXXXXX' con tu ID de contenedor de 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-XXXXXX');
    </script>
    <!-- Aquí termina el código de Google Tag Manager -->

    <?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
    <!-- El resto del código HTML de tu sitio -->
</body>
</html>

Recuerda reemplazar 'GTM-XXXXXX' con el ID de tu contenedor de Google Tag Manager. Puedes encontrar este ID en el código que se te proporcionó al crear tu contenedor en la plataforma de Google Tag Manager.

Al agregar este código al archivo «header.php» de tu tema de WordPress, el contenedor de Google Tag Manager se cargará en todas las páginas de tu sitio antes de la etiqueta de cierre </head>. Esto permitirá que tus etiquetas, como el seguimiento de Google Analytics o cualquier otro píxel de seguimiento, se activen correctamente en tu sitio web.

Recuerda guardar una copia de seguridad del archivo «header.php» antes de realizar cualquier modificación y asegúrate de realizar pruebas para confirmar que el código se esté ejecutando correctamente en tu sitio.

Paso 4: Verifica la implementación

  1. Accede a tu sitio web y navega por varias páginas para asegurarte de que el código de Google Tag Manager se está cargando correctamente.
  2. Vuelve a tu cuenta de Google Tag Manager y verifica si el estado del contenedor cambia a «Activo» o muestra alguna actividad de vista previa.

¡Y eso es todo! Ahora has agregado Google Tag Manager a tu sitio de WordPress utilizando código sin la necesidad de un plugin. Recuerda que es importante realizar pruebas para asegurarte de que todo esté funcionando correctamente.

Si en algún momento deseas realizar cambios en tus etiquetas o agregar nuevas funcionalidades a través de Google Tag Manager, simplemente tendrás que acceder a tu cuenta de Google Tag Manager y realizar las modificaciones necesarias en la interfaz web. Los cambios se aplicarán automáticamente a tu sitio web sin necesidad de editar el código nuevamente.

Espero que esta guía te haya sido útil. ¡Buena suerte con la implementación de Google Tag Manager en tu sitio de WordPress!

Related Posts

Subscribe
Subscribe