Disponible en los planes Observe o
.
El filtro de elemento clicado refina los datos de sesión en función de dónde los usuarios han hecho clic en su sitio, como botones o enlaces, sin necesidad de configurar manualmente los Eventos de Hotjar en su código. Puede refinar este filtro especificando condiciones como el texto de un botón o enlace clicado, el selector CSS o la URL de la página en la que existe el elemento.
Este artículo cubrirá:
- Casos de uso comunes para el filtro de elemento clicado
- Cómo utilizar el filtro de elemento clicado
- Cuándo utilizar el filtro de elemento clicado en lugar de Eventos
- Preguntas frecuentes sobre el filtro de elemento clicado
Casos de uso comunes para el filtro de elemento clicado
A continuación se presentan algunos ejemplos de casos de uso para el filtro de elemento clicado:
-
Verificar el rendimiento de diferentes llamadas a la acción (CTA) como parte de una prueba A/B.
Aplica el filtro de elemento clicado en Tendencias, con la condición de texto del botón o enlace siendo el texto de cada variante de botón. Luego compara el número de sesiones para cada variante y accede a las grabaciones y mapas de calor relacionados para un análisis más detallado del comportamiento del usuario después de hacer clic en una CTA en particular.
-
Encontrar las razones por las que los usuarios no completan su compra.
Desde la página de Grabaciones, aplica el filtro de elemento clicado con tres condiciones: clicado no ocurrió, donde el texto del botón o enlace contiene Checkout, y donde la URL de la página contiene /checkout. Observa algunas grabaciones filtradas para entender qué podría estar impidiendo que los usuarios realicen el pago. Luego, visualiza un mapa de calor con el mismo filtro de elemento clicado aplicado a la página de pago para identificar qué es lo que los usuarios no están viendo y qué es lo que está captando su atención en su lugar.
-
Descubrir oportunidades para mejorar un flujo de incorporación.
Para encontrar ideas para animar a los nuevos usuarios a invitar también a sus colegas, aplica un filtro de elemento clicado en la página de Grabaciones. Selecciona las condiciones: clicado no ocurrió, donde la URL de la página contiene /onboarding, y donde el texto del botón o enlace contiene Invitar a miembros del equipo. Observa las grabaciones para entender por qué los usuarios no están invitando a sus colegas y genera algunas ideas de mejora.
-
Tomar decisiones más informadas para un rediseño.
Las decisiones para rediseñar un sitio web y aumentar el número de demos reservadas pueden basarse en la aplicación de un filtro de elemento clicado a tus datos de sesión recopilados. Agrega las condiciones: clicado no ocurrió, donde el texto del botón o enlace contiene Reservar una demo. Observa las grabaciones para descubrir qué podría estar impidiendo que los usuarios avancen con la reserva de una demo. Aplica el mismo filtro de elemento clicado a un mapa de calor de desplazamiento para entender cuántos usuarios no están viendo la CTA de Reservar una demo en la parte inferior de la página.
Cómo utilizar el filtro de elemento clicado
Haz clic en el menú desplegable Agregar filtro y selecciona Elemento clicado.
Agrega cualquier condición para refinar aún más el filtro.
Puedes refinar el filtro de elemento clicado aplicando múltiples condiciones.
Si ocurrió o no ocurrió un clic
Cuando filtras Tendencias, Grabaciones o Mapas de calor, puedes elegir si filtrar las sesiones en las que el clic ocurrió o no ocurrió.
Cuando filtras Embudos, esta opción está fija en ocurrió.
Texto del botón o enlace
Esto filtra el texto visible en el botón o enlace, por ejemplo, 'Más información' o 'Checkout'.
Selector CSS
Solo admitimos selectores CSS tal como aparecen almacenados por Hotjar. Esto puede diferir de cómo aparecen los selectores CSS al copiarlos de tu sitio en vivo. Por esta razón, cuando uses el filtro de selector CSS, recomendamos rastrear los ID de HTML, que son únicos y están contenidos dentro del selector CSS en lugar de usar el selector CSS completo.
Por ejemplo, en lugar de usar el filtro: selector CSS es x, recomendamos usar el filtro selector CSS contiene y (donde 'y' sería igual a un ID HTML único).
No admitimos valores de selector CSS que incluyan espacios en blanco. Como solución alternativa, puedes eliminar los espacios en blanco utilizando este sitio web Eliminar todos los caracteres de espacio en blanco.
¿Qué son los selectores CSS?
Los selectores CSS definen qué elementos en una página recibirán un conjunto específico de reglas CSS (o estilos). Por ejemplo, el selector CSS .button coincidirá con cualquier elemento en una página que tenga un atributo de clase button.
URL de la página
Consulta nuestro artículo Cómo utilizar condiciones en el filtrado de URL para obtener ayuda sobre cómo utilizar las URL como condición de filtro, incluido el uso de expresiones regulares.
Haz clic en Aplicar para confirmar y filtrar los datos de tu sesión.
Cuándo usar el filtro de elemento clicado en lugar de Eventos
La API de Eventos de Hotjar te permite enviar eventos de clic a Hotjar que se pueden utilizar para filtrar datos de sesión o para dirigir encuestas y widgets de comentarios. Los siguientes puntos pueden ayudarte a decidir cuándo utilizar el filtro de elemento clicado o la API de Eventos con los clics de los usuarios:
Cuándo usar el filtro de elemento clicado
- Pruebas A/B que se centran claramente en si se hace clic en un elemento o no (por ejemplo: posición o redacción de un botón).
- Validar rápidamente una suposición o identificar posibles problemas relacionados con si se hace clic en un elemento o no, sin necesidad de código adicional o tiempo de desarrollo.
- Informar rediseños o mejoras en el sitio donde el objetivo es aumentar los clics en un elemento.
- Tu sitio tiene un plan de Negocios u Observación.
Cuándo usar la API de Eventos
-
-
- Estás activando una encuesta o widget de comentarios: El filtro de elemento clicado no está disponible con las encuestas y comentarios.
- Pruebas A/B más detalladas que van más allá de solo analizar si se hace clic en un elemento específico o no (por ejemplo: desplazamiento del usuario, tiempo en la página, mostrar un error o si la variante A/B se carga en la misma URL que el control).
- Si estás intentando rastrear interacciones en un elemento anidado, es posible que desees utilizar Eventos. Al utilizar el filtro de elemento clicado, Hotjar solo rastreará los elementos HTML button y a. Dado que HTML puede ser anidado, si Hotjar no encuentra el elemento que especificaste, nuestro algoritmo se moverá al siguiente elemento padre y buscará allí. Si no se puede encontrar dentro de los tres elementos padre siguientes, Hotjar no podrá recopilar los datos.
-
¿Funciona el filtro de elementos clicados con Feedback y Encuestas?
Actualmente, el filtro no está disponible con Feedback y Encuestas. Puedes informarnos cómo sería útil tener el filtro con Feedback y Encuestas haciendo clic en el botón Contacta con nosotros a continuación.
Nuestro sitio está disponible en varios idiomas, ¿podemos incluir todas las variaciones de idioma dentro de un filtro aplicado?
No podemos incluir varias variaciones de idioma en un filtro aplicado. Puedes informarnos cómo sería beneficioso tener esta opción haciendo clic en el botón Contacta con nosotros a continuación.
¿Por qué no veo ningún resultado basado en mi filtro de texto de botón/enlace?
La configuración de supresión de tu sitio puede estar impidiendo que Hotjar vea el texto referenciado en tu filtro. Por ejemplo, si Hotjar está suprimiendo el texto del botón/enlace, esto significa que Hotjar no puede reconocer el texto porque estamos almacenando asteriscos (****) en lugar del texto del botón/enlace en sí.
Una solución alternativa para esto es utilizar Eventos de Hotjar para enviar eventos de clic a Hotjar, haciéndolos disponibles en las herramientas de Hotjar para filtrar o activar. La configuración en el código de tu sitio podría ser similar al siguiente ejemplo:
document.querySelector('#my-button')
.addEventListener('click', () => hj('event', 'clicked_cta'));
Para obtener más detalles sobre cómo utilizar Eventos para rastrear eventos de clic, consulta nuestros artículos sobre ¿Qué son los Eventos?, Cómo configurar Eventos y la Referencia de la API de Eventos.