lab
Esc

Prueba con

↑↓ para moverte · Enter para abrir · también en /buscar?q= para agentes

herramienta intermedio claude-codecodexcliclarity

Clarity CLI: prepara etiquetas y revisa la instrumentación de tu web

Genera el fragmento de Clarity y audita tu HTML para comprobar que la medición está configurada antes de revisar métricas exportadas.

✓ verificado el 26 oct 2026

Instrucciones para tu agente

Esto es lo que se copia. Pégaselo a tu agente y te lo monta paso a paso.

O ábrelo directamente en ClaudeChatGPT

Pega este texto a tu agente (Claude Code, Codex, OpenCode, Hermes o el que uses) y dile «ayúdame a montarlo». Son los pasos para ponerlo en marcha; el porqué de cada pieza está en la guía completa.


Para el agente: cómo acompañar al usuario

  1. Pregunta primero para qué lo quiere. Si su objetivo no necesita algún paso, sáltalo.
  2. Antes de instalar, comprueba lo que ya tiene (versiones, claves, sistema operativo).
  3. Avanza un paso cada vez: explica en una frase qué vas a hacer y deja que el usuario lo ejecute o lo apruebe.
  4. Tras cada paso, comprueba que funcionó antes de seguir. Si falla, para y explica el error.
  5. No inventes comandos ni opciones: si la documentación del proyecto contradice estos pasos, manda la documentación.
  6. Al terminar, haz una prueba real con el objetivo del usuario y dile dónde profundizar.

Pasos de configuración

Paso 1: prepara el acceso

Comprueba que tienes Node.js ≥22.20.0, npm/npx y Go ≥1.26.10 disponibles, y que el directorio de binarios queda en PATH. El instalador del catálogo usa Go para compilar y la CLI skills para las instrucciones del agente; el mínimo Node cubre ambas fases. Localiza el identificador de tu proyecto de Clarity y un archivo HTML existente; sustituirán abc123 y ./index.html en los ejemplos.

Paso 2: instala la CLI

Ejecuta el comando de instalación del README:

npx -y @mvanhorn/printing-press-library install clarity

Paso 3: prueba el flujo documentado

Ejecuta los comandos en este orden. Los términos, dominios e identificadores de ejemplo se sustituyen por los que correspondan a tu trabajo.

clarity-pp-cli snippet install abc123 --format html

Inserta el fragmento generado en ./index.html antes de auditar ese archivo:

clarity-pp-cli audit html ./index.html --json --select found_project_id,calls

Comprobación

Comprueba que found_project_id coincide con tu proyecto.

Comprueba que cada comando termina correctamente y que la salida corresponde a la cuenta, fuente o datos que seleccionaste. Una lista vacía no demuestra que el dato no exista: comprueba primero el alcance de la consulta y, si usas una copia local, su sincronización.

Si algo falla

Si no aparecen sesiones, comprueba el proyecto y las peticiones de recogida en el navegador. Revisa también los atributos de enmascarado si la visibilidad del contenido no coincide con lo esperado. Consulta el README de esta CLI para las opciones específicas de tu sistema y versión. No compartas credenciales en la salida de diagnóstico.

ver en .md ¿Prefieres el recurso entero?

Qué es

Clarity CLI ayuda a instrumentar una web con Microsoft Clarity. Genera fragmentos de JavaScript y atributos HTML, comprueba archivos locales y puede consultar la API de exportación de datos. Forma parte de Printing Press Library y tiene código y documentación propios dentro del catálogo.

Para qué te sirve

  • Cuando añades Clarity a una página y quieres revisar el identificador de proyecto.
  • Cuando necesitas comprobar si el HTML contiene las llamadas de instrumentación esperadas.

Cómo funciona

Los comandos snippet producen código de instalación e identificación. audit inspecciona HTML local. insights live consulta los datos de exportación mediante un token; esa vía es distinta de la instrumentación que se ejecuta en el navegador.

Antes de empezar

Para generar el fragmento necesitas el identificador de tu proyecto de Clarity. La exportación de métricas requiere un token de Data Export; la generación de snippets no lo necesita. La instalación recomendada con Node y npx incorpora el binario y su skill para agentes; las alternativas están en el README de esta herramienta. La carpeta contiene una licencia Apache-2.0; GitHub no detecta una licencia global para el catálogo.

Límites y alternativas

No debe presentarse como una descarga general de grabaciones o mapas de calor. La instrumentación necesita tráfico real y una configuración correcta de privacidad. Usa el panel de Clarity para la inspección visual de sesiones.

Recursos