> ## Documentation Index
> Fetch the complete documentation index at: https://docs.landerlab.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Configura la integración con Microsoft Clarity

> Aprende a añadir Microsoft Clarity a tus landing pages en LanderLab para grabar sesiones, ver mapas de calor y descubrir exactamente cómo interactúan los visitantes con tus páginas.

<Frame>
  <img src="https://mintcdn.com/landerlab-babdc23f/6p5E_h-1a6k3u1JY/images/LL-Clarity.png?fit=max&auto=format&n=6p5E_h-1a6k3u1JY&q=85&s=ba999c1cd6907f2a3d4c66cad2e8ca18" alt="Los logotipos de LanderLab y Microsoft Clarity uno al lado del otro, que representan la integración con Clarity" width="1200" height="600" data-path="images/LL-Clarity.png" />
</Frame>

Añade Microsoft Clarity a tus landing pages en LanderLab para grabar sesiones reales de los visitantes, ver mapas de calor de clics y desplazamiento, y descubrir en qué punto se atascan antes de convertir.

## Qué es Microsoft Clarity

Microsoft Clarity es una herramienta gratuita de analítica del comportamiento. Graba las sesiones de los visitantes y las convierte en mapas de calor y grabaciones, para que puedas ver cómo se desplazan, hacen clic y se mueven personas reales por tu landing page.

Mientras que Google Analytics te dice **qué** ha pasado, Clarity te muestra **por qué** ha pasado. Puedes detectar clics muertos, clics de frustración y puntos de abandono en un paso concreto de tu embudo.

LanderLab instala el script de Clarity por ti. En lugar de pegar el código de seguimiento en tu página, introduces tu Project ID y LanderLab añade el script al publicar.

<Note>
  Cuando añades una integración de Microsoft Clarity, se guarda de forma **global** en tu cuenta. Puedes conectar la misma cuenta a todas las landing pages que quieras sin volver a introducir los datos.
</Note>

## Cómo añadir Microsoft Clarity

<Steps>
  <Step title="Abre tu landing page">
    Ve a **Landing Pages** y haz clic en el **nombre de la landing page** en la que quieres analizar el comportamiento de los visitantes.
  </Step>

  <Step title="Abre el panel de integraciones">
    Haz clic en **Add Integration** y busca **Clarity** en la barra de búsqueda o abre la categoría **Tracking** de la izquierda.
  </Step>

  <Step title="Añade tu cuenta de Clarity">
    Haz clic en **Microsoft Clarity** y después en **Add another account** si ya tienes una guardada. Aparecerá un breve formulario de configuración.

    <Frame>
      <img src="https://mintcdn.com/landerlab-babdc23f/jONgRNq0MGCYtFrd/images/add-clarity.png?fit=max&auto=format&n=jONgRNq0MGCYtFrd&q=85&s=ac89597902a4df18e1c3c37290d67cd9" alt="El formulario de configuración de Microsoft Clarity en LanderLab, con los campos Name y Project ID" width="1197" height="862" data-path="images/add-clarity.png" />
    </Frame>
  </Step>

  <Step title="Rellena los dos campos">
    | Campo          | Descripción                                                                                                                                |
    | :------------- | :----------------------------------------------------------------------------------------------------------------------------------------- |
    | **Name**       | Una etiqueta para identificar esta cuenta (por ejemplo, "Microsoft Clarity" o "Clarity embudo solar"). Es útil cuando guardas más de una.  |
    | **Project ID** | El ID de tu proyecto de Clarity, una cadena alfanumérica corta como `abcdef1234`. Lo encontrarás en los ajustes de tu proyecto de Clarity. |
  </Step>

  <Step title="Haz clic en Add Microsoft Clarity">
    Haz clic en **Add Microsoft Clarity** para guardar la cuenta. Se guarda de forma global, así que estará lista para usarla en cualquier otra landing page.
  </Step>

  <Step title="Conéctalo a la página">
    Haz clic en **Connect to page**, elige en **Apply to variants** qué variantes deben ejecutar el script y confirma con **Connect to page**.

    <Frame>
      <img src="https://mintcdn.com/landerlab-babdc23f/uL31bP77dl4bZTVy/images/image-37.png?fit=max&auto=format&n=uL31bP77dl4bZTVy&q=85&s=596b6a433bbb6d5714d8951b34caaa78" alt="La ventana Connect to page, con el selector Apply to variants en All variants" width="587" height="273" data-path="images/image-37.png" />
    </Frame>

    <Note>
      **All variants** está seleccionado por defecto. Déjalo así si quieres los mismos datos de Clarity en todo tu test A/B, o elige una sola variante para aislar un diseño.
    </Note>
  </Step>

  <Step title="Publica la página">
    Haz clic en **Publish** o **Republish**. El script de Clarity solo se ejecuta en la página en vivo, así que las grabaciones empiezan después de publicar.
  </Step>
</Steps>

## Conecta Microsoft Clarity a otra landing page

Como las cuentas de Clarity se guardan de forma global, nunca tienes que introducir el Project ID dos veces.

<Steps>
  <Step title="Abre la otra landing page">
    Ve a **Landing Pages** y abre la página que quieres analizar.
  </Step>

  <Step title="Selecciona tu cuenta guardada">
    Haz clic en **Add Integration**, busca **Clarity** y verás tu cuenta guardada en la lista con su Project ID. Haz clic en **Connect to page** junto a ella.
  </Step>

  <Step title="Elige las variantes y publica">
    Selecciona las variantes en **Apply to variants**, confirma y usa **Publish** o **Republish** en la página.
  </Step>
</Steps>

## Dónde encontrar tu Project ID de Clarity

1. Inicia sesión en [clarity.microsoft.com](https://clarity.microsoft.com).
2. Abre el proyecto que quieres usar o haz clic en **New project** para crear uno.
3. Ve a **Settings** y después a **Overview** o **Setup**.
4. Copia el **Project ID**, un código alfanumérico corto como `abcdef1234`.

<Frame>
  <img src="https://mintcdn.com/landerlab-babdc23f/EgAIN8K3eV1lQTIh/images/Group-2147226301-1.png?fit=max&auto=format&n=EgAIN8K3eV1lQTIh&q=85&s=5e50750769fdecb285785d58afc5edf0" alt="La página de ajustes del proyecto de Microsoft Clarity, con el lugar donde aparece el Project ID" width="2940" height="1607" data-path="images/Group-2147226301-1.png" />
</Frame>

También puedes leerlo directamente en la barra de direcciones del navegador. Con un proyecto abierto, la URL contiene el ID justo después de `/projects/view/`.

<Tip>
  No hace falta que sigas las instrucciones de instalación que te muestra Clarity. LanderLab inyecta el script automáticamente, así que el Project ID es lo único que necesitas.
</Tip>

## Cómo comprobar que Clarity funciona

<Steps>
  <Step title="Visita tu página publicada">
    Abre la URL en vivo de tu landing page en una pestaña normal del navegador e interactúa con ella durante unos segundos.
  </Step>

  <Step title="Revisa el panel de Clarity">
    Vuelve a Clarity y abre **Recordings**. Tu sesión debería aparecer en unos minutos.
  </Step>
</Steps>

<Warning>
  Si no aparecen datos, vuelve a publicar la landing page y asegúrate de que seleccionaste la variante correcta en **Apply to variants**. Los bloqueadores de anuncios y los navegadores centrados en la privacidad también pueden bloquear Clarity, así que haz la prueba en una ventana limpia del navegador.
</Warning>

## Por qué usar Microsoft Clarity

* **Ver sesiones reales**: mira exactamente cómo se desplazan los visitantes por tu página, cómo rellenan tu formulario o en qué punto lo abandonan.
* **Leer mapas de calor**: descubre qué títulos, botones y secciones llaman realmente la atención y cuáles se ignoran.
* **Detectar fricciones rápido**: los clics de frustración y los clics muertos señalan directamente botones rotos, CTAs confusos o elementos que la gente espera que sean clicables.
* **Mejorar tus tests A/B**: combina las grabaciones de Clarity con los tests A/B de LanderLab para entender por qué una variante funciona mejor que otra, no solo por cuánto.
* **Gratis y sin límites de tráfico**: Clarity es gratuito y no muestrea tus datos, así que funciona bien incluso en campañas de tráfico de pago con mucho volumen.
