Cómo integrar Hotjar con tu tienda Shopify

Al optimizar su tienda Shopify para lograr mayores conversiones, es clave comprender cómo interactúan los visitantes con sus páginas.

Hotjar te ayuda a visualizar el comportamiento del usuario a través de mapas de calor, seguimiento de desplazamiento y grabaciones de sesiones, para que puedas tomar decisiones informadas sobre diseño y contenido.

Acerca de Hotjar

Hotjar es una popular herramienta de análisis de comportamiento y retroalimentación que ayuda a los comerciantes de Shopify a comprender cómo los visitantes interactúan con sus tiendas.

Proporciona mapas de calor, seguimiento de desplazamiento, grabaciones de sesiones y widgets de comentarios, lo que le permite identificar puntos problemáticos y mejorar la experiencia del cliente.

Hotjar te permite:

• Visualice dónde los usuarios hacen clic o pasan la mayor parte del tiempo en sus páginas de destino.
• Detectar problemas de diseño o maquetación que puedan afectar las conversiones.
• Optimice elementos como CTA, banners y secciones de productos en función de datos reales de usuarios.

Antes de que empieces

Antes de comenzar, asegúrese de tener:

• Una cuenta Hotjar (con su código de seguimiento listo).
• Accede a tu administrador de Shopify.
• Una tienda Shopify publicada (no una versión de desarrollo o sandbox).

¿Cómo agregar el código de seguimiento de Hotjar a tu Shopify?

Siga estos pasos para conectar Hotjar a su tienda Shopify:

Paso 1: Inicie sesión en su cuenta hotjar.

Paso 2: Desde la barra lateral izquierda, vaya a Prepárate, luego haga clic en Copiar código.

Paso 3: En su Administración de Shopify, navegue a Tienda en línea > Temas, haga clic en el icono de tres puntos y seleccione Editar Código desde el desplegable.

Paso 4: Abra su theme.liquid .

Paso 5: Pegue el código de seguimiento de Hotjar justo antes del cierre </head>  .

Una vez terminado, haga clic en Guardar.

¿Cómo agregar el código de seguimiento de Hotjar a GemPages?

Si ya ha agregado el código Hotjar a su tema de Shopify, el seguimiento también se aplicará automáticamente a todos Creado con GemPages páginas publicadas bajo el mismo dominio.

Si desea realizar un seguimiento del comportamiento de los visitantes en páginas específicas creadas con GemPages, puede agregar su script Hotjar usando el Elemento de Código Personalizado (Custom Code).

He aquí cómo hacerlo:

Paso 1: Desde el panel de control de GemPages, vaya a Páginas y haga clic en la página objetivo para abrirla en el editor.

Paso 2: En la pantalla Editor de GemPagesUsa la barra de búsqueda para localizar el elemento "Código personalizado". Luego, arrástralo y suéltalo en tu página.

Paso 3: En la barra lateral izquierda, haga clic en el Código (Lazy section loading) bajo la sección Código personalizado Sección para abrir el panel de código.

Paso 4: En la sección HTML / CSS pestaña, pegue su código de seguimiento de Hotjar.

Una vez terminado, haga clic en Guardar y golpear Publicar para republicar su página con las actualizaciones.

Verifique su integración con Hotjar

Para confirmar que Hotjar está funcionando correctamente:

Paso 1: Vaya a su Panel de control de Hotjar para comprobar el estado del sitio.

Paso 2: Deberías ver un verde “Seguimiento activo” Indicador una vez que su tienda recibe tráfico.

Si el estado muestra “No seguimiento”, revise los puntos a continuación:

• La tienda todavía está en un Sandbox de Shopify entorno: Hotjar no rastrea vistas previas ni tiendas de desarrollo.
• El script de seguimiento no está colocado correctamente: asegúrese de que esté agregado antes de cierre en su tema o dentro del elemento de código personalizado en GemPages.
• Su página aún no ha recibido tráfico de visitantes real.
• Almacenamiento en caché del navegador: borre el caché o vuelva a verificarlo en Modo incognito.

Para obtener más detalles, consulte la documentación de Hotjar: Cómo instalar Hotjar en tu sitio de Shopify.

Preguntas frecuentes sobre la integración de Hotjar

1. ¿Puedo usar Hotjar en el modo sandbox o de vista previa de Shopify?

No. Hotjar lo hace. No es compatible con entornos Sandbox de Shopify., incluidas las tiendas de vista previa o de desarrollo. Debe tener una Tienda en vivo y de acceso público para que el seguimiento funcione correctamente.

2. ¿Hotjar rastrea automáticamente las páginas de GemPages?

Si el código de seguimiento de Hotjar se agrega a su tema de Shopify theme.liquid, también se cargará en Creado con GemPages páginas publicadas bajo el mismo dominio.

Sin embargo, si su página utiliza un dominio personalizado, subdominio o publicación independiente configuración, debe agregar manualmente el código usando GemPages' Elemento de Código Personalizado (Custom Code) para garantizar un seguimiento preciso.

3. ¿Qué pasa si Hotjar no detecta mi sitio?

Asegurarse de que:

• Tu tienda es vivir (no sandbox).
• El guión está colocado antes del cierre </head>  .
• Has borrado tu caché o has probado en modo incógnito.

Si el problema persiste, consulte Guía de configuración de Shopify de Hotjar.

4. ¿Cuál es la diferencia entre Hotjar y Microsoft Clarity?

• Hotjar ofrece herramientas de retroalimentación más avanzadas (encuestas, seguimiento de clics) e información detallada para planes pagos.
• Microsoft Clarity es completamente sesiones gratuitas, con mapas de calor ilimitados y grabaciones de sesiones.

Consulte este artículo para obtener más detalles sobre la integración de Microsoft Clarity con Shopify.