Los objetivos de clic en elementos se activan cuando los visitantes hacen clic en elementos específicos de la página. Perfectos para rastrear botones CTA, navegación y enlaces externos.
Cuándo usar objetivos de clic
Mejor para rastrear:
- Botones de llamada a la acción (CTA)
- Clics en menús de navegación
- Enlaces de descarga
- Enlaces externos
- Botones de reproducción de vídeo
- Cualquier elemento clickable
Crear objetivos de clic
Los objetivos se encuentran en el panel de control de cada sitio web, bajo la pestaña Journeys.
Abrir la pestaña Journeys
Desde el panel de control de su sitio web, abra la pestaña Journeys y seleccione la subpestaña Objetivos.
Agregar un objetivo
Haga clic en Agregar Objetivo, luego elija Clic en Elemento como tipo de objetivo.
Nombrar el objetivo
Dele un nombre claro, como "Botón de registro" o "CTA de precios".
Ingresar un selector CSS
En el campo Selector CSS, ingrese el selector que identifica el elemento a rastrear.
Rastrear valor (opcional)
Active Rastrear valor monetario si desea asociar un valor de ingresos a cada completación.
Crear
Haga clic en Crear para guardar el objetivo.
Selectores CSS
¿Qué es un selector CSS?
Un patrón que identifica elementos HTML:
<button id="signup-btn" class="cta primary">
Registrarse
</button>
Selectores para este botón:
#signup-btn(por ID).cta(por clase)button.primary(por etiqueta y clase)
Selectores comunes
| Selector | Coincide con |
|---|---|
#my-id | Elemento con id="my-id" |
.my-class | Elementos con class="my-class" |
button | Todos los elementos de botón |
a.download | Enlaces con class="download" |
[data-action] | Elementos con atributo data-action |
Encontrar el selector correcto
Método 1: Inspector del navegador
- Haga clic derecho en el elemento
- Elija "Inspeccionar"
- Encuentre el elemento en DevTools
- Busque un id o clase única
Método 2: Probar en la consola
- Abra la consola del navegador (F12)
- Escriba:
document.querySelector('your-selector') - Si el elemento se muestra, el selector funciona
Mejores prácticas de selectores
Usar IDs cuando estén disponibles
Opción más confiable:
<button id="cta-signup">Registrarse</button>
Selector: #cta-signup
Usar clases específicas
Si no hay ID, use una clase descriptiva:
<button class="btn btn-primary cta-main">Comenzar</button>
Selector: .cta-main
Evitar selectores genéricos
| Malo | Problema |
|---|---|
button | Coincide con todos los botones |
.btn | Muy común |
a | Todos los enlaces |
| Bueno | Por qué |
|---|---|
#signup-cta | ID único |
.cta-signup | Clase específica |
[data-goal="signup"] | Construido para este propósito |
Agregar atributos de datos
Solicite a los desarrolladores que agreguen atributos rastreables:
<button data-goal="signup" class="btn">Registrarse</button>
Selector: [data-goal="signup"]
Ejemplos comunes
Botones CTA
| Objetivo | Selector |
|---|---|
| CTA principal | #hero-cta |
| CTA secundario | .cta-secondary |
| CTA de precios | .pricing-cta |
Navegación
| Objetivo | Selector |
|---|---|
| Enlace de precios | a[href="/pricing"] |
| Enlace de contacto | nav a[href="/contact"] |
| Iniciar sesión | .nav-signin |
Descargas
| Objetivo | Selector |
|---|---|
| Cualquier descarga | a[download] |
| Descargas de PDF | a[href$=".pdf"] |
| Archivo específico | a[href="/files/guide.pdf"] |
Enlaces externos
| Objetivo | Selector |
|---|---|
| Enlaces externos | a[target="_blank"] |
| Enlaces de afiliados | a[href*="partner.com"] |
| Enlaces sociales | .social-links a |
Selectores avanzados
Selectores de atributos
| Patrón | Coincide con |
|---|---|
[attr] | Tiene atributo |
[attr="value"] | Coincidencia exacta |
[attr*="value"] | Contiene |
[attr^="value"] | Comienza con |
[attr$="value"] | Termina con |
Combinadores
| Patrón | Coincide con |
|---|---|
div button | Botón dentro de div |
div > button | Botón hijo directo |
button:first-child | Primer botón |
button:not(.disabled) | No deshabilitado |
Ejemplos
/* Enlaces a sitios externos */
a[href^="http"]:not([href*="mysite.com"])
/* Botones enviar no deshabilitados */
button[type="submit"]:not(:disabled)
/* Enlaces de descarga en el área de contenido */
.content a[href$=".pdf"]
Cómo se cuentan los clics
Un objetivo de clic se completa una vez por sesión de visitante. Zenovay registra el primer clic coincidente en una sesión e ignora los clics posteriores en el mismo elemento dentro de esa sesión, por lo que un visitante que hace clic dos veces cuenta como una conversión. El mismo visitante que regresa en una nueva sesión puede completar el objetivo nuevamente.
Si desea rastrear un clic específico solo en ciertas páginas, límitelo a nivel de selector combinando el selector de clic con un padre que solo existe en esas páginas, o use un objetivo de coincidencia de URL para conversiones basadas en páginas.
Elementos dinámicos
Elementos agregados después de la carga de la página
El rastreo de clics se adjunta a nivel de documento, por lo que funciona para elementos que aparecen después de la carga inicial de la página, incluido el contenido renderizado por frameworks de JavaScript.
Prueba de elementos dinámicos
- Cargue la página
- Espere a que aparezca el elemento
- Haga clic en el elemento
- Verifique que el objetivo se active
Solución de problemas
Los clics no se rastrean
Verificar el selector:
// En la consola del navegador
document.querySelector('your-selector')
// Debe devolver el elemento
Verificar la visibilidad del elemento:
- ¿Es visible el elemento al hacer clic?
- ¿Está oculto o cubierto por otro elemento?
Elementos incorrectos coinciden
Haga el selector más específico:
- Agregar contexto principal
- Usar una clase más única
- Agregar atributo de datos
Elementos de carga retrasada
Si el elemento se carga después de la página:
- La mayoría de los casos funcionan automáticamente
- Pruebe completamente
- Considere un objetivo de evento personalizado si los problemas persisten
Mejores prácticas
Planificar sus selectores
Antes de implementar:
- Identificar CTAs clave
- Asegurar identificadores únicos
- Documentar selectores
- Probar en todas las páginas
Trabajar con desarrolladores
Solicite:
- IDs únicos en CTAs clave
- Atributos de datos para rastreo
- Convenciones de nomenclatura consistentes
Probar completamente
- Haga clic en el elemento usted mismo
- Verifique la vista en tiempo real
- Verifique que el objetivo se registró
- Pruebe también en móvil