Debido a posibles problemas de seguridad inherentes al funcionamiento de los iframes, Hotjar no puede realizar un seguimiento de las interacciones del usuario dentro de los iframes. Sin embargo, Hotjar puede mostrar iframes, siempre y cuando el iframe no dependa de JavaScript para mostrar su contenido. Hotjar se refiere a mostrar iframes de esta manera como "permitir" iframes.
En este artículo, explicaremos la configuración y características relacionadas con los iframes, y las limitaciones que persisten cuando se utiliza Hotjar con páginas que contienen iframes.
- ¿Cuál es el comportamiento por defecto cuando Hotjar detecta un iframe?
- ¿Qué significa permitir iframes en Hotjar?
- ¿Qué limitaciones existen después de permitir un iframe?
¿Cuál es el comportamiento por defecto cuando Hotjar detecta un iframe?
Por defecto, los Heatmaps y las Recordings bloquearán el contenido iframe. En lugar del contenido iframe, verás un mensaje indicando que Hotjar no puede rastrear iframes insertados en su página:
Si no estás familiarizado con los iframes, puedes pensar en ellos como páginas web dentro de otras páginas web. A menudo se los puede utilizar para añadir herramientas o contenido de un sitio web de terceros, como chatbots, vídeos o formularios. Puedes aprender más sobre iframes en la documentación de Mozilla Developer Network.
¿Qué significa permitir iframes en Hotjar?
Hotjar ofrece la posibilidad de permitir que iframes aparezcan dentro de Heatmaps y Recordings. Sin embargo, esto no significa que Hotjar pueda rastrear las interacciones del usuario dentro de los iframes. Sólo significa que puede cargar el contenido de la página del iframe. Si JavaScript está requerido para que el contenido del iframe se cargue, los siguientes pasos no funcionarán porque Hotjar no permiterá que se cargue el JavaScript.
Antes de permitir iframes en tu Sitio Hotjar, revise la siguiente sección de este artículo que describe las limitaciones que pueden impedir que los iframes se muestren en Hotjar.
Cómo permitir un iframe en Hotjar:
Añade data-hj-allow-iframe como atributo HTML a tu iframe.
Puedes hacerlo añadiendo un atributo HTML, data-hj-allow-iframe, al iframe que deseas mostrar.
<iframe src="https://example.com/page.html" data-hj-allow-iframe=""></iframe>
Los siguientes formatos funcionan también: data-hj-allow-iframe="", data-hj-allow-iframe="true", data-hj-allow-iframe. De cualquier forma, el valor se mostrará como "true" en el backend.
Este atributo tiene que estar dentro del elemento <iframe> y no en el elemento padre del iframe. Muchas herramientas de terceros no permiten editar sus elementos <iframe>. En este caso, no es posible permitir iframes.
Una página del origen de iframe se recargará cada vez que se muestre dentro de Hotjar
La URL a la que apunta el iframe está guardada en nuestros servidores y se recarga cada vez que reproduces un Recording. Si la carga de la página del origen del iframe causa alguna actividad adicional, esta acción puede causar resultados inesperados y adversos.
Ve a tu página Sitios y organizaciones.
Haz clic en el icono de engranaje de configuración del sitio para visitar la página de configuración de tu sitio.
Abra el menú focalización y seguimiento de la sesión.
Introduce el nombre de dominio de nivel superior que desea permitir, bajo del título DOMINIOS IFRAME PERMITIDOS.
Introduce sólo el dominio de nivel superior cuando introduzca nombres de dominio en el campo DOMINIOS IFRAME PERMITIDOS. El dominio de nivel superior es el dominio sin www, http://, o https:// conectado a él. Por ejemplo, si desea permitir https://www.hotjar.com/es/ en este campo, el dominio de nivel superior sería hotjar.com.
¿Qué limitaciones existen después de permitir un iframe?
Antes de permitir un iframe, ten en cuenta estas limitaciones que persistirán después de permitir el iframe:
❌ Hotjar no puede permitir un iframe si su atributo src utiliza una ruta de página relativa (Ejemplo: src="/page") en lugar de la URL completa (Ejemplo: src="https://hotjar.com/page").
❌ Hotjar bloquea JavaScript dentro del iframe.
❌ Las interacciones (eventos de clic y desplazamiento, escritura, animaciones CSS, mutaciones DOM, etc.) no se rastrean en el iframe.
Estas limitaciones significan que muchos iframes de terceros no funcionarán porque dependen de JavaScript. Algunos ejemplos de tipos de contenido que no funcionan con un iframe permitido incluyen:
- Chatbots
- Reproductores de vídeo de terceros (incluidos YouTube y Vimeo)
- Formularios de terceros (incluidos los de Typeform)
- Aplicaciones web que se cargan a través de iframes
- La mayoría de los sistemas de pago de terceros
- La mayoría de los contenidos de terceros
Esto significa que Hotjar solo puede mostrar los siguientes aspectos de un iframe permitido:
✅ Contenido de página estático (sin JavaScript) que se carga a través de un iframe.
✅ Se rastrea el comportamiento del cursor, relativo a la página padre.
Solución para iframes del mismo dominio
Si puedes editar el HTML de tu elemento iframe, y la URL de origen de tu iframe utiliza el mismo dominio que la página a la que se está añadiendo el iframe, puedes colocar el código de Hotjar dentro de la página de origen del iframe, en lugar de la página padre. Con esta opción, puede rastrear la página de origen del iframe pero no otros aspectos de la página principal.