Ir al contenido principal

Guía de Configuración para el seguimiento de Navegación Web (Webtracking)

En esta guía detallamos el proceso para integrar el script de Webtracking según la plataforma utilizada.

Actualizado hace más de 2 semanas

Para algunos e-commerce, como Shopify, brindamos una documentación específica, mientras que en otras como VTEX, el webtracking se integra con la instalación de la aplicación de WoowUp.

Documentación por Plataforma:


1. Configuración del Seguimiento Web

Para habilitar el seguimiento de navegación web en el e-commerce, es necesario colocar dos scripts en el código del sitio web:

  • Script #1 (Librería): Se encarga del procesamiento general de seguimiento.

  • Script #2 (Captura de SKU): Registra el SKU de los productos visitados y envía la información a la cuenta en WoowUp.​​

❗Es fundamental configurar correctamente las variables para que los datos se registren de forma adecuada.

2. Agregar el Script #1 (Librería)

Este script debe colocarse en todas las páginas del sitio, justo antes del cierre de la etiqueta </body>.

Código:

<script src="https://assets-cdn.woowup.com/js/webtracking.min.js" type="text/javascript"></script>

⚠️Asegúrate de colocar este script en todas las páginas para garantizar un seguimiento continuo de la navegación del usuario.

3. Agregar el Script #2 (Captura de SKU)

Este script debe colocarse exclusivamente en las páginas de productos. Existen distintas variantes según la plataforma utilizada.

Ejemplo de Script Genérico:

<script type="text/javascript">
let metadata = {
sku: "XXXXXXX", // Requerido
price: 543.21, // Requerido
offer_price: 123.45 // Opcional, puede ser null
/* Puede agregar más metadatos si es necesario */
};

let callback = function () {
/* Opcional: Agregue aquí cualquier acción posterior al seguimiento */
}

WU.track('{Your-PublicKey}', 'product-view', metadata, callback);
</script>

Configuración de los valores:

  • {Your-PublicKey}→ Reemplaza este valor con la clave pública de tu cuenta WoowU. Puedes encontrarla en Configuración de la cuenta> Mi cuenta> Claves para desarroladores.

    Por ejemplo, si la clave pública es 12345, el código quedaría así:

    WU.track('12345', 'product-view', metadata, callback);

  • sku: "XXXXXXX" → Esta variable almacena el identificador del producto. Debes asegurarte de utilizar el mismo SKU que se configura en WoowUp, este dato debe viajar entre comillas ("").

    ⚠️Atención: Debe viajar el SKU según está configurado en el catálogo, ya sea por productos padres o productos hijos.

    • En Indumentaria se suelen usar SKUs de productos padre.

    • En Electrónica y Farmacias, generalmente se usan los SKUs de productos hijos.

  • price: 543.21 → Precio de lista del producto. Debe viajar sin comillas.

  • offer_price: 123.45 → Precio de oferta. Debe viajar sin comillas. Si no aplica, puede omitirse o completarlo como null

4. ¿Cómo compruebo que el Script está funcionando?

Para verificar que el webtracking está funcionando correctamente, recomendamos realizar una prueba siguiendo estos pasos:

  1. Crea un usuario de Prueba

    Desde el módulo de Segmentos>Crear haz clic en Nuevo cliente (parte superior derecha):


    Completa los datos del cliente con el correo que utilizarás para la prueba, junto con un nombre y apellido:

  2. Crea una Campaña de Prueba

    Desde el módulo de Campañas selecciona Nueva campaña y elige la opción "única vez". Si precisas más detalle para crear una campaña, visita el artículo 👈


    Desde el Editor de la campaña vamos a añadir la Fila de recomendación: Elige tú mismo los productos, seleccionando un SKU aleatorio del catálogo.​

    Una vez que tenemos lista nuestra campaña debemos hacer un envío de prueba o test, en este artículo 👈 te lo explicamos en detalle.

  3. Verifica los datos que se transmiten

    Una vez enviado el correo de prueba, el siguiente paso consiste en hacer clic en el enlace recibido, haciendo clic en el producto del correo o en el botón "comprar" que nos enviará al producto dentro del e-commerce.

    Desde ahí, presiona la tecla F12 (o clic derecho>inspeccionar) para abrir las herramientas de desarrollo (DevTools). En este panel, selecciona la pestaña Network en la barra superior.

    (ten en cuenta que la pantalla puede verse distinta según el navegador que estés utilizando).

    En el campo Filter, escribe track y recarga la página presionando la tecla F5.

    Verás tres eventos con código 200. Uno será una solicitud POST con los datos del producto.

    Verifica que se esté enviando correctamente el SKU (padre o hijo, según tu configuración).

    ​En caso de que alguno de estos eventos no retorne un código de estado 200 (éxito), te recomendamos revisar el detalle del evento para obtener más información o, en su defecto, contactar al equipo de soporte a través del chat de la plataforma o escribiendo al correo [email protected].

5. Verifica los datos de la navegación

Después de seguir los pasos anteriores, espera unos minutos para que el evento se procese. Luego dirígete a la sección "Navegación Web" dentro de WoowUp, la encontrarás desde la configuración de la cuenta.

✅ Si el script está instalado correctamente:

Aparecerá un banner confirmando que se ha implementado correctamente:

Luego tenemos que validar si la información enviada a woowup fue la correcta, para hacer esto vamos a ingresar al perfil 360 del email utilizado y en el historial debe aparecer un evento de navegación que se ve de la siguiente forma:

Este evento es un listado desplegable, al hacer clic mostrará toda la información de la navegación web donde podremos corroborar que la información que viajo es la correcta:

Te recomendamos revisar nuevamente la información en los campos: SKU y Precio. Asegúrate de que coincida con la información en el sitio web.

❌ Si el script presenta problemas:

Se mostrará un banner indicando que la información de webtracking no está viajando correctamente. En este caso, es necesario contactar al equipo de soporte de WoowUp para recibir asistencia.

Esperamos que este artículo te ayude a implementar correctamente el seguimiento de navegación web de tu e-commerce. 🙌

¿Necesitas ayuda adicional?

No dudes en comunicarte con nuestro equipo de soporte. Estamos disponibles vía chat en la plataforma o por correo a [email protected].

¿Ha quedado contestada tu pregunta?