Seguimiento de conversiones de Trackboxx

Con el seguimiento de conversiones de Trackboxx, puedes medir las acciones que realizan los visitantes en tu sitio web, por ejemplo, clics en enlaces importantes, formularios enviados o visitas a determinadas páginas.
Estos datos te ayudan a evaluar con precisión el éxito de tus medidas de marketing y de tu sitio web.

Importante: con Trackboxx también puedes hacer un seguimiento automático de las conversiones y los objetivos. Este método es mucho más sencillo y no tienes que añadir código a tu sitio web. Lee el artículo: Objetivos automáticos

¿Qué tipos de conversiones puede registrar Trackboxx?

Trackboxx admite los siguientes eventos:

• Clics en enlaces, botones o entradas de menú
• Visitas a determinadas páginas (por ejemplo, una página de agradecimiento)
• Envío de formularios
• Eventos JavaScript propios

Cada conversión se muestra en el panel de control con los siguientes datos:

• Nombre del proyecto objetivo
• Número de disparos
• Valor (opcional)
• Tasa de conversión en el periodo seleccionado

1. Crear conversión

Así es como se crea un nuevo objetivo:

1. Haz clic en la rueda dentada situada en la parte superior derecha.
2. Selecciona páginas web
3. Selecciona la página web y haz clic en Objetivos
4. Haz clic en Crear un objetivo
5. Asigna nombre y descripción
6. Recibirás un código como este:

Este ID básico se integrará posteriormente en los ejemplos de código correspondientes.

2. Seguimiento de clics

Puedes realizar un seguimiento de los clics de diferentes maneras.
Trackboxx recomienda la variante JavaScript, ya que es más estable, flexible y compatible con el RGPD.

2.1 Seguimiento de clics mediante JavaScript

a) Seguimiento mediante un ID CSS

<a href="/kontakt/" id="kontakt-link">Kontakt</a>
Lenguaje del código: HTML, XML (xml)

Código de seguimiento:

<script>
document.getElementById('kontakt-link').addEventListener('click', () => {
    trackboxx('trackGoal', 'DEINE-ID');
});
</script>
Lenguaje del código: HTML, XML (xml)

b) Seguimiento mediante una clase CSS

<script>
document.querySelector('.kontakt-link').addEventListener('click', () => {
    trackboxx('trackGoal', 'DEINE-ID');
});
</script>Lenguaje del código: HTML, XML (xml)

⚠️ Nota:
querySelector() rastrea solo el primer elemento con esta clase.

Para varios elementos a la vez:

<script>
document.querySelectorAll('.kontakt-link').forEach(el => {
    el.addEventListener('click', () => {
        trackboxx('trackGoal', 'DEINE-ID');
    });
});
</script>
Lenguaje del código: HTML, XML (xml)

2.2 Seguimiento de clics con redirección inmediata (enlaces externos, descargas, mailto, tel)

Si al seguir un enlace el visitante abandona la página inmediatamente, es posible que el navegador no tenga tiempo de enviar la señal de seguimiento.

Solución:
► Retrasa brevemente la redirección y ejecútala solo después de enviar la señal de seguimiento .

Ejemplo:

<script>
document.querySelectorAll('.externer-link').forEach(el => {
  el.addEventListener('click', (e) => {
    e.preventDefault();
    trackboxx('trackGoal', 'DEINE-ID');
    setTimeout(() => {
      window.location = el.href;
    }, 150);
  });
});
</script>
Lenguaje del código: HTML, XML (xml)

Recomendado para:

• enlaces externos
• Descargas en PDF
• Enlaces Mailto
• Enlaces telefónicos
• Enlaces de afiliados

2.3 Seguimiento de clics mediante HTML en línea (onclick)

Este método funciona, pero no es óptimo:

<a href="/kontakt/" onclick="trackboxx('trackGoal', 'DEINE-ID');">Kontakt</a>
Lenguaje del código: HTML, XML (xml)

⚠️ Desventajas:

• más difícil de mantener
• A menudo se sobrescribe con los creadores de páginas.
• menos fiable técnicamente

Recomendación: JavaScript en lugar de inline.

3. Visitas a la página (conversiones de visitas a la página)

Para medir la frecuencia con la que se visita una página determinada:

<script>
document.addEventListener('DOMContentLoaded', () => {
    trackboxx('trackGoal', 'DEINE-ID');
});
</script>
Lenguaje del código: HTML, XML (xml)

Ideal para:

• Páginas de agradecimiento
• Confirmaciones de pedido
• Páginas de confirmación tras enviar un formulario

4. Seguimiento de formularios

Hay cuatro formas:

4.1 Supervisar el formulario mediante onsubmit (si es posible acceder)

<form onsubmit="trackboxx('trackGoal', 'DEINE-ID');">
Lenguaje del código: HTML, XML (xml)

Fácil: funciona en cualquier lugar donde se pueda editar HTML.

4.2 Seguimiento del envío de formularios mediante JavaScript

Si se necesita eventListener:

<script>
document.querySelector('#kontaktformular').addEventListener('submit', () => {
    trackboxx('trackGoal', 'DEINE-ID');
});
</script>
Lenguaje del código: HTML, XML (xml)

4.3 Sistemas de formularios con lógica de éxito propia (por ejemplo, generadores inteligentes)

<script>
sk('form', 'init', {
  onSuccess: function() {
    trackboxx('trackGoal', 'DEINE-ID');
  }
});
</script>
Lenguaje del código: HTML, XML (xml)

→ Funciona con herramientas que tienen su propio hook «success».

4.4 Seguimiento mediante una página de agradecimiento (solución alternativa)

Si nada de esto funciona:

1. Formulario enviado correctamente
2. Redireccionar a una nueva página (por ejemplo, /gracias/)
3. Utilizar el código de seguimiento de visitas en esta página

Esa es la solución más universal.

5. Seguimiento específico de WordPress

5.1 Seguimiento de clics en menús mediante clase CSS

Por ejemplo, asigna esta clase CSS a un elemento del menú de WordPress:

CSS-Klasse: neu-hier
Lenguaje del código: HTTP (http)

Seguimiento:

<script>
document.querySelector('.neu-hier').addEventListener('click', () => {
    trackboxx('trackGoal', 'DEINE-ID');
});
</script>
Lenguaje del código: HTML, XML (xml)

Generador automático de códigos de conversión

// Introduce primero tu ID de conversión.

Artículos relacionados:

Seguimiento de Google Ads / Facebook Ads mediante UTM En este artículo te mostramos cómo puedes realizar un seguimiento y evaluar tus campañas de pago en Google o Meta/Facebook con Trackboxx.