Antes de seguir esta guía, debes instalar Google Tag Manager en tu sitio
Si aún no tienes instalado Google Tag Manager, primero debes configurarlo. Utiliza el artículo de Configuración e instalación de Tag Manager de Google para aprender cómo hacerlo.
Esta guía describe cómo instalar el Código de Seguimiento de Hotjar utilizando Google Tag Manager (GTM). Las tres opciones para esta instalación son:
- Integración de Hotjar y Google Tag Manager
- Etiqueta de Código de Seguimiento de Hotjar desde Google Tag Manager
- Etiqueta HTML personalizada desde Google Tag Manager
También puedes usar GTM para enviar eventos a Hotjar y establecer atributos de usuario
Después de instalar Hotjar, también puedes usar GTM para enviar eventos y atributos de usuario. Obtén más información en nuestros artículos Cómo enviar atributos de usuario con Google Tag Manager y Cómo enviar eventos a Hotjar con Google Tag Manager
Integración de Hotjar y Google Tag Manager
Visita tu página de Sitios y haz clic en Instalar código de seguimiento.
Si Hotjar estaba instalado previamente en tu sitio web pero luego fue eliminado, es posible que no veas la opción "Instalar código de seguimiento". Si la opción "Instalar código de seguimiento" no está presente, deberás seguir una de las otras opciones de instalación mencionadas en este artículo.
Haz clic en Iniciar configuración desde la ventana de Instalar con Google Tag Manager.
Solo verás esta opción si tu sitio tiene un contenedor de GTM instalado
Se te mostrará el primer paso de esta integración si Hotjar ha detectado automáticamente que tu sitio tiene un contenedor de GTM. Si no ves el primer paso, sigue los pasos para instalar la Etiqueta de Código de Seguimiento de Hotjar desde Google Tag Manager.
Selecciona la cuenta de Google conectada al contenedor de GTM en tu sitio.
Este es el sitio donde instalarás el Código de Seguimiento de Hotjar.
¿Ves algunas pantallas ligeramente diferentes?
Google controla todos los pasos que implican iniciar sesión en GTM y otorgar permisos a Hotjar. El flujo exacto y la apariencia de la página pueden cambiar, pero los pasos no deberían cambiar mucho.
Selecciona todos los permisos de acceso para Hotjar y haz clic en Continuar.
Selecciona tu cuenta de GTM y tu contenedor de etiquetas de GTM, luego haz clic en Crear y publicar etiqueta.
Asegúrate de seleccionar el Contenedor de GTM que está instalado en tu sitio
Hotjar te indicará aquí si no tienes ningún contenedor en esta cuenta de Google. Si no lo tienes, sigue las instrucciones en la documentación oficial de Google.
Haz clic en Confirmar y Crear.
Espera unos minutos para que Google responda, luego haz clic en Verificar la instalación.
Sigue las indicaciones para verificar la instalación.
Deberías ver un mensaje confirmando la instalación. Si no lo ves, consulta nuestro artículo Cómo comprobar que Hotjar está funcionando. ¡No dudes en contactarnos si necesitas ayuda!
Etiqueta de código de seguimiento de Hotjar desde Google Tag Manager
Desde tu panel de Google Tag Manager, haz clic en Agregar una nueva etiqueta.
Haz clic en el icono de etiqueta y selecciona Etiqueta de código de seguimiento de Hotjar de la lista.
Ingresa tu ID de sitio de Hotjar en el campo de texto.
Para obtener tu ID de sitio de Hotjar, visita tu página de Sitios. Desde aquí verás una lista de los Sitios y Organizaciones a los que tienes acceso, junto con los ID de sitio a la izquierda de la URL del sitio.
Haz clic en el área de Disparadores para elegir en qué páginas aparecerá el Código de Seguimiento.
Selecciona Todas las páginas como disparador y luego haz clic en Guardar.
Las aplicaciones de una sola página solo deben usar el tipo de disparador "Vista de página"
Los disparadores de cambio de estado de Google Tag Manager entran en conflicto con el propio sistema de Hotjar para detectar cambios en aplicaciones de una sola página. Para obtener más información, consulta el artículo de Google Tag Manager sobre el disparador de Vista de página.
Haz clic en el botón Enviar en la parte superior derecha de la página del Espacio de trabajo.
Haz clic en el botón Publicar para publicar la etiqueta.
Espera unos minutos para que Google y luego verifica que la instalación haya funcionado desde Hotjar.
Deberías ver un mensaje confirmando la instalación dentro de Hotjar. Si no lo ves, consulta nuestro artículo Cómo comprobar que Hotjar está funcionando.
Etiqueta HTML personalizada desde Google Tag Manager
Ve a tu página de Sitios y haz clic en el enlace Ver código de seguimiento para el Sitio que deseas rastrear.
Haz clic en Copiar al portapapeles.
Desde la página del Espacio de trabajo de Google Tag Manager, haz clic en el botón Agregar una nueva etiqueta.
Haz clic dentro del área de Configuración de etiquetas.
Selecciona HTML personalizado de la lista.
Pega el código que copiaste previamente de Hotjar en el campo de texto.
Haz clic dentro del área de Disparadores.
Haz clic en Todas las páginas.
Esto es importante: si eliges cualquier otro disparador, Hotjar no funcionará correctamente.
Nombra la etiqueta y luego haz clic en el botón Guardar.
Envía tus cambios.
Asegúrate de que se haya seleccionado tu entorno en vivo y haz clic en Publicar.
Espera unos minutos para que Google verifique y luego verifica que la instalación haya funcionado desde Hotjar.
Deberías ver un mensaje que confirme la instalación dentro de Hotjar. Si no lo ves, visita Solución de problemas de instalación de Google Tag Manager para verificar tus configuraciones de GTM.
Si sigues ese artículo y la configuración es correcta en GTM, visita nuestra guía Cómo verificar que Hotjar está funcionando para obtener pasos adicionales de solución de problemas.