Seguimiento de eventos personalizados

Con este nuevo submódulo, podrá crear sus propias etiquetas para cualquier evento que desee rastrear, añadirlas a su sitio web y ver cómo se desarrolla el disparo de un evento a lo largo del tiempo. Pronto también podrá autoescanear su sitio web en busca de elementos predeterminados (es decir, formularios, botones, imágenes, etc.) sin tener que añadir ningún código adicional y rastrearlos de inmediato. Esta característica le ayuda inmensamente en el seguimiento de los eventos que específicamente.

Nota importante: El seguimiento manual de eventos no está disponible para los sitios web de Wix (no se pueden crear etiquetas personalizadas, ya que no hay control del código para elementos específicos de la página), sino que sólo funcionará el seguimiento automático.

Este artículo de soporte está estructurado en las siguientes secciones:

1. Primeros pasos
   1. Reutilización de etiquetas de eventos de Google Analytics
   2. Crear una nueva etiqueta de evento manualmente
   3. Seguimiento automático de eventos por defecto en su sitio web
2. Tabla principal de eventos
   1. Visión general
   2. Filtrado y agrupación
   3. Plantillas de filtro
3. Diagrama de líneas

Justo encima de la tabla se ve una barra que permite elegir un determinado rango de tiempo o incluso un día al que deben corresponder los datos de abajo. Es importante limitar la visualización de los datos a determinadas fechas o periodos en los que se realizaron posibles campañas o se tomaron otras medidas para medir el éxito de estas acciones de cara a una futura planificación.

• Por favor, asegúrese de que ha actualizado su código de seguimiento con la versión más reciente (sustituya el código de seguimiento actual por el recién publicado), para poder beneficiarse de esta función.
• Muchos elementos contienen opciones para pasar la información o realizar otras acciones. Sólo tienes que dejar que el cursor pase por encima de varios elementos y descubrir cuántos datos hay en realidad en un mosaico.
• Casi todas las vistas y algunos elementos individuales tienen un pequeño "icono-i" en la esquina superior derecha, que te da más información sobre la vista/elemento. Sólo tienes que mover el cursor allí y verás más información.

Para facilitar el cambio de Google Analytics a Visitor Analytics, hemos decidido estructurar nuestras propias etiquetas de eventos de forma idéntica a las de Google Analytics. Esto le permitirá -sin tener que hacer NINGUNA ACTUALIZACIÓN en su sitio web- hacer un seguimiento de todos sus eventos ya añadidos dentro de Visitor Analytics. Desafortunadamente, hasta ahora, no es posible importar datos de eventos pasados de Google Analytics a Visitor Analytics - esto se arreglará pronto.

Siempre que quiera crear una nueva etiqueta de evento para hacer un seguimiento de lo que ocurre en su sitio web, puede hacerlo fácilmente en Visitor Analytics. Puede crear nuevas etiquetas desde el botón "Más opciones", justo al lado del título de la función. 

Nota importante: El seguimiento manual de eventos no está disponible para los sitios web de Wix (no se pueden crear etiquetas personalizadas, ya que no hay control del código para elementos específicos de la página), sino que sólo funcionará el seguimiento automático.

La etiqueta de evento debe integrarse en el código fuente para poder realizar un seguimiento del evento para el que se ha creado la etiqueta. Más adelante encontrará instrucciones sobre cómo añadir la etiqueta de evento.

En general, una etiqueta de evento puede estar compuesta por los siguientes campos:

1. Categoría del Evento: típicamente el objeto con el que se interactuó, por ejemplo, imagen o botón (campo obligatorio)
2. Acción del evento: define en qué acción debe dispararse el evento, es decir, reproducción, clic, pausa, etc. (campo obligatorio)
3. Etiqueta del evento: puede ser un nombre o una palabra utilizada para describir las características o cualidades del evento específico, para distinguir fácilmente entre eventos similares, es decir, vídeo del producto, imagen de apoyo, etc. (campo opcional)
4. Valor del evento: un valor numérico asociado al evento, es decir, 1, 2, 3, etc. (campo opcional)
5. Campo Objeto: cualquier parámetro adicional que quiera añadir usted mismo para identificar el evento (campo opcional)

Una vez definidos los campos anteriores, puede vincular esta nueva etiqueta de evento a una acción determinada. Se le mostrarán en un desplegable. Elija la acción a la que desea que se dispare el evento y haga clic en el botón "generar etiqueta de evento" en la esquina inferior derecha dentro del modal que aparece a continuación.

Una vez que haya generado su nueva etiqueta de evento, debe integrarla en su sitio web para que Visitor Analytics pueda realizar un seguimiento del lanzamiento de este evento.

Es bastante sencillo y hay varias maneras de hacerlo:

Edite su código fuente HTML y añada la etiqueta de evento a los elementos que desee.

Puedes añadir la etiqueta que nuestra aplicación crea para tu evento, ya sea como un fragmento de JS o directamente en el elemento, como en el tutorial de abajo.

Aquí hay un ejemplo para un botón en HTML y cómo debería verse para que el clic en ese botón sea rastreado como un evento:

<button id="important-btn">Click me!</button>

Opción A: fragmento de JS

<script>
document.getElementById("important-btn")
  .addEventListener("click", function(){
    va("send", "event", "example-category", "btn-click", "Important Button")
  });
</script>

Opción B: directamente en el elemento

<h2 onclick="va('send', 'event', 'example-category', 'btn-click', 'important', 123);">Important button</h2>

Ambas opciones son semánticamente correctas y hacen lo mismo en el caso ideal.

Sin embargo, la opción A permite más flexibilidad. Por ejemplo, se podría añadir una clase "visa-track" a varios elementos y llamar al método va de una manera más dinámica confiando en las capacidades de JS.

La limitación con la opción B es que podría ser anulada por algún otro código JS que se cargue después de que el DOM sea renderizado ( element.onclick = function(){ ... } ), provocando así que nuestro código nunca sea llamado.

En comparación, la opción A permite añadir un número ilimitado de escuchadores de eventos (siempre que la memoria del dispositivo del agente de usuario pueda soportarlo).

La primera versión de esta funcionalidad le permite obtener una visión general de los eventos disparados para algunos elementos estáticos por defecto en su sitio.

Aquí puede ver qué elementos (input, select, textarea, button, radio, checkbox) del sitio pueden ser identificados automáticamente con la versión actual, y las acciones (onmouseover, onclick, keyup, onchange) que pueden ser rastreadas en cada uno:

Notas importantes:

• Esta función actúa de forma 100% complementaria a cualquier etiqueta de evento manual, por lo que no es necesario añadir ningún fragmento de etiqueta creado manualmente a su código fuente. Sólo tiene que activar el seguimiento automático para ponerlo en marcha.
• Para los sitios web de Wix, sólo es posible el Auto-Tracking (al menos por el momento), por lo que no habrá posibilidad de elegir si se activa el Manual y/o el Auto-Tracking, sino sólo el Auto.
• Las etiquetas de los elementos, se obtienen automáticamente de su página HTML, así que directamente del código, tal y como se llamaron cuando se construyó el sitio. Si quiere que la etiqueta de un elemento rastreado tenga un nombre diferente, eso debe cambiarse dentro del HTML de la página directamente. Las etiquetas de Categoría y Acción de estos elementos de seguimiento automático son estándar (según la lista presentada anteriormente) y no pueden ser editadas.
• Los elementos que forman parte de una ventana emergente, o algo dinámico que aparece en su página como resultado de ciertas acciones realizadas por el usuario, pueden no ser tratados adecuadamente por nuestro sistema (por ejemplo, pasar el ratón por una imagen de un producto que hará que aparezca un botón "Comprar ahora", podría ser uno de los casos en los que no podemos rastrear los eventos disparados en ese elemento recién aparecido, ya que no es algo estático que estaba en la página desde el principio).
• Muy pronto, también añadiremos otros elementos para los que se puedan rastrear estos eventos disparados, como imágenes, enlaces, vídeos, etc. para la(s) próxima(s) versión(es).

Una vista previa en vivo también estará disponible pronto, para que pueda saber exactamente qué acciones se activaron en qué elementos, viendo esto directamente dentro de una imagen con su propia página web.

Dentro de la tabla principal de eventos rastreados, hay un botón "Mostrar evento en la página web", para los elementos rastreados automáticamente.

Haga clic en él y se abrirá una vista previa de la propia página en una nueva pestaña con la posibilidad de ver detalles importantes sobre sus eventos de seguimiento automático, de una manera más legible para el ser humano, que sólo la tabla de los eventos de seguimiento que ha estado viendo anteriormente:

La configuración de la vista previa

Cada fila de este menú de configuración muestra los ajustes definidos y algunos de los elementos de seguimiento automático relacionados con la información:

1. Resultados basados en el periodo: Período seleccionado para el que se está mostrando el número de eventos disparados. Si desea ver los datos para un intervalo diferente, vuelva a la aplicación, cambie el periodo y vuelva a abrir el previsualizador.
2. Suma de disparos de eventos automáticos rastreados: El número de todos los desencadenantes de eventos que fueron rastreados para todos sus elementos autoidentificados en el período de tiempo seleccionado.
3. Suma de eventos rastreados automáticamente en la página: El número de todos los elementos que pudieron ser autoidentificados como rastreables en la página actual. Esto no significa que haya acciones rastreadas en todas ellas, es sólo un recuento de los elementos que pueden ser auto-rastreados en esta URL.
4. Resaltar todos los eventos de seguimiento automático: Activando esta opción, se resaltarán todos los elementos que pueden ser auto-rastreados y al pasar el ratón por cada uno de ellos, aparecerán más detalles sobre qué acciones fueron rastreadas, cuántas veces se dispararon y desde qué dispositivo. La información detallada sólo puede mostrarse para un elemento a la vez, al pasar el ratón sobre él.
5. Mostrar la suma de disparos para cada uno de los eventos de seguimiento automático: Esto cambiará la información sobre herramientas de la detallada presentada anteriormente, a una que sólo muestra la cantidad total de eventos disparados para todos los elementos de la página sobre la que se pasa el cursor, en el período seleccionado.

Notas importantes:

• Para garantizar una experiencia de usuario impecable, desactive todos los AdBlockers para no encontrar ningún problema técnico al utilizar esto.
• La cantidad de disparos mostrada siempre se refiere al periodo de tiempo previamente seleccionado dentro de la aplicación.
• Durante el modo de vista previa del evento, su visita NO se cuenta ni sus acciones causan ningún recuento de activadores de eventos.

Esta tabla ofrece una visión general de todos los eventos que se han disparado a lo largo del periodo de tiempo seleccionado. Cada línea representa un disparo de un evento. Por lo tanto, si el mismo evento se disparó 20 veces en el período de tiempo seleccionado, habrá 20 líneas para este evento.

La tabla contiene las siguientes columnas:

1. Categoría: Representa el valor que usted mismo ha añadido para el campo de esta etiqueta de evento (etiquetas añadidas manualmente). Este campo nunca estará vacío, ya que el campo es obligatorio para una etiqueta de evento.
2. Acción: Representa el valor que has añadido tú mismo para el campo de esta etiqueta de evento (etiquetas añadidas manualmente). Este campo nunca estará vacío, ya que el campo es obligatorio para una etiqueta de evento.
3. Etiqueta deevento: Representa el valor que has añadido tú mismo para el campo de esta etiqueta de evento (etiquetas añadidas manualmente). Este campo puede estar vacío, ya que el campo no es obligatorio para una etiqueta de evento.
4. Valor del evento: Representa el valor que ha añadido usted mismo para el campo de esta etiqueta de evento (etiquetas añadidas manualmente).. Este campo puede estar vacío, ya que el campo no es obligatorio para una etiqueta de evento.
5. Campo Objeto: Representa el valor que has añadido tú mismo para el campo de esta etiqueta de evento (etiquetas añadidas manualmente). Este campo puede estar vacío, ya que el campo no es obligatorio para una etiqueta de evento.
6. Ubicación: En qué página (título de la página/URL) se ha disparado el evento. Al hacer clic en él, se abrirá la página correspondiente en una nueva pestaña.
7. Hora del evento: Indica la fecha y hora en que se produjo el evento.
8. Tipo: Aquí puedes ver si el evento disparado es un evento añadido manualmente por ti mismo o si ha sido identificado por nuestro auto-seguimiento de eventos.

La tabla permite varias opciones de filtrado y agrupación. La principal diferencia entre filtrar y agrupar es relativamente sencilla. Al filtrar se reduce la cantidad de eventos mostrados en la tabla. Al agrupar no se reduce el número de eventos mostrados en la tabla, sino que se conectan los eventos por el campo por el que se agrupan. Juegue con la tabla y comprenderá fácilmente la diferencia. Ambos enfoques le ofrecen posibilidades sencillas pero potentes para mostrar sus datos y recuperar hechos interesantes de ellos.

Puede crear fácilmente plantillas de filtros para sus combinaciones de filtros establecidas. Una vez que haya añadido una combinación de filtros a la tabla principal que probablemente reutilizará más veces en el futuro, sólo tiene que hacer clic en el botón

El diagrama de líneas refleja básicamente los datos que se le presentan en la tabla anterior. Notará que sólo verá una línea - que se refiere a toda la cantidad de eventos mostrados o filtrados en la tabla anterior - por defecto.

Cuanto más filtro active para la tabla de arriba, menos eventos se mostrarán en la tabla. Esto también reducirá la cantidad de eventos reflejados en el diagrama de líneas de arriba.

Es importante tener en cuenta el comportamiento del diagrama de líneas, una vez que se agrupan los datos dentro de la tabla de arriba. Verá que si el usuario quiere ver el diagrama de líneas de un grupo específico, tendrá que filtrarlo por adelantado...