Google Tag Manager debe estar instalado en tu sitio antes de seguir esta guía
Si aún no has instalado Google Tag Manager, primero necesitarás configurarlo. Utiliza el artículo de Google Configuración e instalación de Tag Manager 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 de 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 Comenzar 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 informará 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 a 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 Añadir una nueva etiqueta.
Haz clic en el icono de etiqueta y selecciona 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 IDs 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 para el disparador y luego haz clic en Guardar.
Las Aplicaciones de Página Única 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 sistema de Hotjar para detectar cambios en aplicaciones de página única. Para más información, echa un vistazo al 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 a 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.
En 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.
Nomina la etiqueta y luego haz clic en el botón Guardar.
Enviar tus cambios.
Asegúrate de que tu entorno en vivo esté seleccionado y haz clic en Publicar.
Espera unos minutos a 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, visita Solución de problemas de instalación de Google Tag Manager para verificar tus configuraciones de GTM.
Si sigues ese artículo y las configuraciones son correctas en GTM, visita nuestra guía Cómo verificar que Hotjar está funcionando para pasos adicionales de solución de problemas.