Los eventos de clientes son las principales acciones realizadas por su público objetivo que brindan información sobre cómo interactúan con su negocio a través de diferentes puntos de contacto. Esto incluye realizar pagos, iniciar una venta, que es un punto de interacción crucial. Los servicios de terceros integrados mejoran su automatización de marketing y análisis mediante el uso de datos de eventos de clientes generados por píxeles.


Tener una mejor comprensión de estos comportamientos puede mejorar significativamente su estrategia de venta al proporcionar datos para refinar su automatización de marketing, análisis y segmentación de audiencia. Los servicios de terceros integrados pueden utilizar estos datos de eventos de clientes, también conocidos como registros, generados por píxeles para ajustar su enfoque de venta.


Este blog ayudará a los desarrolladores de marca a comprender cómo agregar y administrar estos píxeles a través de su cuenta de Shopify. Bueno, intentemos comenzar con lo básico, ¿de acuerdo?


¿Qué son los píxeles?


Desde una introducción de lo que son los píxeles, hasta crear píxeles personalizados para su audiencia B2B y garantizar su implementación exitosa en su tienda en varios canales, esta guía cubre todos los aspectos que necesita conocer para administrar eficazmente las interacciones de los clientes dentro de su comunidad Shopify. Puede administrar píxeles que rastreen eventos de clientes con el Administrador de píxeles de Shopify.


El administrador de píxeles de Shopify le permite agregar y administrar píxeles para rastrear eventos de clientes. Los eventos de clientes son acciones que ocurren en el navegador del cliente, como hacer clic en un enlace o agregar un artículo al carrito de compras.


La sección de eventos de clientes de su administración de Shopify es donde los expertos pueden agregar y administrar píxeles.


Los píxeles se pueden agregar o migrar a su tienda en línea de dos formas: píxeles de aplicaciones, instalados por aplicaciones de marketing y recopilación de datos, y píxeles personalizados, que un desarrollador puede agregar manualmente a través del administrador de píxeles de su cuenta.


Antes, los comerciantes podían agregar fragmentos de código JavaScript a su tienda en línea manualmente. Podían hacer esto en las preferencias en línea, los scripts de pago y las aplicaciones.Podían hacer esto en las preferencias en línea, los scripts de pago y las aplicaciones en inglés.La mayor parte del tiempo, estos scripts no se verificaban a fondo y su gestión llevaba mucho tiempo. Con el administrador de píxeles, sus scripts se mantienen en una sola herramienta de gestión y se ejecutan en un entorno seguro


Asegúrese de que su tema no contenga ningún código de seguimiento existente antes de comenzar. Este código generalmente se encuentra en plantillas líquidas como theme.liquid, product.liquid y checkout.liquid, así como en el campo de scripts adicionales en la configuración de pago. Este paso es esencial para asegurarse de que puede avanzar con confianza sin preocuparse por conflictos de scripts.


Beneficios de incluir píxeles de aplicaciones o píxeles personalizados en su tienda

  • Acceso a un flujo de eventos de cliente, como eventos de pago, en su tienda en línea.
  • Protección adicional para su tienda en línea y sus clientes, incluido un mejor control sobre la información del cliente que comparte con proveedores externos.
  • Evita que se ejecute código no autorizado de JavaScript que no funcione o interfiera con su tienda en línea y pago.
  • Herramientas integradas para el cumplimiento de la privacidad

Crear el código para un píxel personalizado 

Creación del SDK de JavaScript de terceros

El código que está conectado con el píxel se le proporciona por el servicio de terceros que está utilizando. El código de seguimiento y un SDK de JavaScript son típicamente las dos partes de un píxel. El sandbox de píxeles de Shopify solo permite JavaScript, por lo que cualquier HTML en el código del servicio de terceros debe eliminarse.

Este es un ejemplo de un píxel de Meta. Habrá una pequeña variación en los píxeles de posición entre terceros.

Meta Pixel Code

Créditos de imagen: Shopify

Es posible que encuentre dominios de píxeles que se cargan con script src=. Los píxeles de Shopify no funcionan con HTML, por lo que deberá cambiar esto por un equivalente en JavaScript. También se ha eliminado el código para rastrear eventos de PageView, ya que se agregará en el siguiente paso.

Script

Créditos de imagen: Shopify

Es posible que encuentre píxeles que se cargan con script src=. Los píxeles de Shopify no funcionan con HTML, por lo que deberá cambiar esto por un equivalente en JavaScript.

También puede ver cómo suscribirse a eventos estándar y eventos personalizados de clientes, que le permiten realizar un seguimiento de eventos de clientes adicionales, como cuando alguien hace clic en un botón. Por ejemplo, si desea realizar un seguimiento de la aparición de órdenes específicas, puede crear un evento personalizado con ese propósito y suscribirse a él.

Este es un ejemplo de un píxel de Google Analytics:

Global Site Tag

Créditos de imagen: Shopify

Puede usar el siguiente código JavaScript en lugar del src= del script. Asegúrese de que el atributo src siempre coincida con la versión en HTML:

JavaScript

Créditos de imagen: Shopify

Suscribirse a eventos estándar

El evento PageView para el píxel de Meta se ve así. Debe tener en cuenta que la función fbq("track") es una parte del código de Meta y que cada negocio tendrá una versión diferente para la que debe consultar su documentación.

PageView

Créditos de imagen: Shopify

Puede transferir metadatos de algunos eventos a su píxel. A continuación, se muestra un ejemplo de cómo se proporciona información de producto al evento ViewContent de Meta:

View Content Theme

Créditos de imagen: Shopify

Suscribirse a eventos personalizados de clientes

Puede agregar eventos personalizados de clientes si desea realizar un seguimiento de eventos de clientes adicionales, como cuando alguien hace clic en un botón. Los eventos estándar y los eventos personalizados se pueden suscribir de la misma manera.

Declare el nombre del evento al que desea suscribirse y envíe esta información al píxel del proveedor de servicios de terceros.

Este es un ejemplo de cómo puede aparecer un evento personalizado en los archivos líquidos de su tema:

Script

Créditos de imagen: Shopify

Aquí hay una forma en que podría configurar su píxel para suscribirse a ese evento personalizado:

Custom event

Agregar un píxel personalizado

Antes de agregar un píxel personalizado, elimine o modifique cualquier píxel existente para evitar el recuento doble de eventos de clientes. El código de píxel existente debe eliminarse manualmente de todas las ubicaciones, incluidos theme.liquid, checkout.liquid y scripts adicionales en la configuración de pago.

Steps: 
1. Abra la configuración > Eventos de clientes a través del administrador de Shopify.

Créditos de imagen: Shopify

2. Denomine su píxel de forma distintiva. Si ingresa el nombre de un píxel personalizado existente, se le pedirá que le dé un nuevo nombre.

3. Para acceder al editor de eventos, haga clic en Agregar píxel.

Pixel NameCréditos de imagen: Shopify

4. En la ventana Código, pegue su propio código de píxel de JavaScript.

5. Para Guardar su píxel personalizado, haga clic en Guardar. Si está listo para conectar su píxel personalizado y comenzar a rastrear sus eventos, puede hacerlo haciendo clic en Conectar píxel.

Conectar un píxel personalizado en su tienda Shopify

Después de agregar un píxel personalizado, debe conectarlo a su tienda para que pueda comenzar a rastrear eventos de clientes.

Steps: 

  1. Haga clic en Píxeles personalizados desde la página Eventos de clientes en su administrador de Shopify.
  2. Bajo el título Píxeles desconectados, puede ver todos los píxeles personalizados que no están conectados actualmente. Haga clic en Conectar en la línea que tiene el píxel personalizado correcto.

Lea los Términos de servicio de Shopify. Si su píxel cumple con los requisitos del servicio, haga clic en Conectar.

Desconectar y eliminar un píxel personalizado

Debe desconectar manualmente el píxel de su tienda en línea para dejar de rastrear los eventos para los cuales agregó un píxel personalizado.

Steps: 

  1. Haga clic en Píxeles personalizados desde la página Eventos de clientes en su administrador de Shopify. 
  2. Los píxeles personalizados que están conectados actualmente se muestran en la parte superior de la lista. Haga clic en Desconectar en la línea del píxel personalizado que desea desconectar. Cuando se desconecta un píxel, no se elimina. 

También puede eliminar los píxeles personalizados que ya no necesita.

Steps: 

  1. En la página Eventos de clientes del administrador de Shopify, haga clic en Píxeles personalizados. 
  2. Haga clic en el botón de puntos suspensivos en la línea del píxel personalizado que desea cambiar. 

Haga clic en Eliminar. Si confirma la eliminación, el píxel personalizado se eliminará del administrador de píxeles.

Conclusión 

Asegúrese de estar familiarizado con la configuración de píxeles antes de crear un píxel personalizado. 

Aquí hay algunas cosas que debe tener en cuenta: 

  • Siempre asegúrese de comprender el código que coloca en el pago de su sitio web o obtenga un píxel personalizado de un Experto de Shopify. 
  • Debido a que los píxeles funcionan en un entorno seguro, hay restricciones sobre qué datos se pueden publicar. 
  • La API de extensión de píxel web le permite acceder a las API del navegador y suscribirse a eventos de clientes con los entornos seguros de Shopify Lax o Strict.