Configuración de la integración estándar de Shopify

Esta página te explica cómo integrar Braze con Shopify utilizando nuestra integración estándar para usuarios con una tienda online en Shopify. Si utilizas un sitio headless de Shopify o quieres implementar soluciones más personalizadas, consulta Configuración de la integración personalizada de Shopify.

Paso 1: Conecta tu tienda Shopify

1. En Braze, ve a Integraciones de socios > Socios tecnológicos y busca “Shopify”.
2. En la página del partner Shopify, selecciona Comenzar la configuración para iniciar el proceso de integración.
   
   
   
   
3. En la tienda de aplicaciones de Shopify, instala la aplicación de Braze.
   
   

Nota

Si tu cuenta de Shopify está asociada a más de una tienda, puedes cambiar la tienda en la que has iniciado sesión seleccionando el icono de la tienda en el encabezado y seleccionando Cambiar de tienda.

4. Después de instalar la aplicación de Braze, se te redirigirá a Braze para que confirmes el espacio de trabajo que quieres conectar a Shopify. Una tienda Shopify solo puede conectarse a un espacio de trabajo. Si necesitas cambiarlo, selecciona el espacio de trabajo correcto.
   
   

5. Selecciona Comenzar la configuración.
   
   

Paso 2: Habilitar los SDK web de Braze

Para las tiendas online de Shopify, puedes seleccionar la configuración estándar para implementar automáticamente el SDK web y el SDK de JavaScript de Braze.

Después de seleccionar la ruta de incorporación con configuración estándar, debes elegir cuándo Braze inicializa y carga los SDK entre las siguientes opciones:

• Al visitar el sitio, por ejemplo, al iniciar la sesión
  • Hace un seguimiento tanto de los usuarios identificados como de los anónimos
• Al registrarse en una cuenta, por ejemplo, al iniciar sesión en la cuenta
  • Hace un seguimiento solo de los usuarios identificados
  • Empieza a hacer un seguimiento de los datos cuando los visitantes del sitio se registran o inician sesión en sus cuentas

Nota

Durante la configuración, a los nuevos clientes se les aprovisionan las versiones más recientes del SDK web y del SDK de JavaScript de Braze. Los clientes existentes pueden ver su versión actual del SDK en la configuración de la integración, recibir una notificación cuando haya una versión más reciente disponible y actualizarla por su cuenta desde la configuración de la integración.

Paso 3: Configura tus datos de Shopify

Configuración de datos estándar

Importante

Para esta integración, el alias de usuario debe utilizar el siguiente formato para que Braze pueda asociar los webhooks con el perfil de usuario correcto:

• alias_label: shopify_cart_${cartToken}
• alias_name: shopify_cart_token

Selecciona los datos de Shopify de los que quieres hacer seguimiento.

Los siguientes eventos están habilitados de forma predeterminada en la integración estándar.

Para obtener más información sobre los datos de los que se hace seguimiento a través de la integración, consulta Características de los datos de Shopify.

Importante

La integración con Shopify admite webhooks de creación y actualización de clientes de Shopify, que se encuentran en la configuración de datos. Cuando se crea o actualiza un perfil de usuario en Shopify, se creará o actualizará el perfil de usuario correspondiente en Braze.

Estas acciones no desencadenan eventos personalizados en Braze y se utilizan únicamente para sincronizar los datos de usuario de Shopify con Braze. Los datos sincronizados incluyen atributos personalizados, atributos estándar y, si están habilitados en tu configuración, estados de grupos de suscripción.

Configuración de la carga retroactiva del historial

En el paso Seguimiento de datos de Shopify, selecciona Activar la carga retroactiva del historial para incluir la carga inicial de datos históricos como parte de tu integración. Elige un intervalo de fechas para los pedidos (Últimos 90 días, Último año o Últimos 2 años) y para los perfiles de cliente (Último año, Últimos 2 años o Todo el tiempo). Braze muestra un recuento estimado de registros y el tiempo de procesamiento de cada opción antes de que termines la configuración. Estas selecciones no se pueden cambiar una vez completada la configuración.

Para saber qué se importa, cómo se comportan los informes de ingresos y qué hacer si ya usas Braze con Campaigns activas o Canvas, consulta Carga retroactiva del historial.

(Avanzado) Configuración del seguimiento de datos personalizados

Con los SDK de Braze, puedes hacer seguimiento de eventos personalizados o atributos personalizados que van más allá de los eventos estándar de esta integración. Los eventos personalizados capturan interacciones únicas en tu tienda, como por ejemplo:

El seguimiento de datos personalizados proporciona información más detallada sobre el comportamiento de los usuarios y permite una personalización adicional. Para implementar eventos personalizados, tienes que editar el código del tema de tu tienda en el archivo theme.liquid. Es posible que necesites la ayuda de tus desarrolladores.

Por ejemplo, el siguiente fragmento de código JavaScript hace seguimiento de si el usuario actual se suscribe a un boletín y lo registra como evento personalizado en su perfil de Braze:

1
2
3
4
5
6
7
8
9

braze.logCustomEvent(
  “subscribed_to_newsletter”,
  {
    newsletterName: ‘News and Offers’,
    customerEmail: ‘customer_1@example.com’,
    sendOffers: true
  }
);

El SDK debe estar inicializado (escuchando la actividad) en el dispositivo del usuario para registrar eventos o atributos personalizados. Para obtener más información sobre el registro de datos personalizados, consulta Objeto User y Objeto logCustomEvent.

Paso 4: Configura cómo gestionas a los usuarios

Selecciona tu tipo de external_id en el desplegable.

Importante

Usar una dirección de correo electrónico o una dirección de correo electrónico con hash como ID externo de Braze puede simplificar la gestión de identidades en todos tus orígenes de datos. Sin embargo, es importante tener en cuenta los riesgos potenciales para la privacidad de los usuarios y la seguridad de los datos.

• Información predecible: Las direcciones de correo electrónico son fáciles de adivinar, lo que las hace vulnerables a ataques.
• Riesgo de explotación: Si un usuario malintencionado altera su navegador web para enviar la dirección de correo electrónico de otra persona como su ID externo, podría acceder a mensajes confidenciales o a información de la cuenta.

De forma predeterminada, Braze convierte automáticamente los correos electrónicos de Shopify a minúsculas antes de usarlos como ID externo. Si usas el correo electrónico o el correo electrónico con hash como ID externo, confirma que tus direcciones de correo electrónico también se convierten a minúsculas antes de asignarlas como ID externo o antes de aplicarles hash desde otros orígenes de datos. Esto ayuda a prevenir discrepancias en los ID externos y a evitar la creación de perfiles de usuario duplicados en Braze.

Nota

Los siguientes pasos dependen del ID externo que selecciones:

• Si seleccionaste un tipo de ID externo personalizado: Completa los pasos 4.1—4.3 para configurar tu ID externo personalizado.
• Si seleccionaste ID de cliente de Shopify, correo electrónico o correo electrónico con hash: Sáltate los pasos 4.1—4.3 y continúa directamente con el paso 4.4.

Paso 4.1: Crea el metacampo braze.external_id

1. En tu página de administración de Shopify, ve a Settings > Metafields and metaobjects.
2. Selecciona Customers > Add definition.
3. En Name, introduce braze.external_id.
4. Selecciona el espacio de nombres y la clave autogenerados (custom.braze_external_id) para editarlos y cámbialos a braze.external_id.
5. En Type, selecciona ID Type.

Una vez creado el metacampo, rellénalo para tus clientes. Te recomendamos los siguientes enfoques:

• Escucha los webhooks de creación de clientes: Configura un webhook para escuchar los eventos customer/create. Así puedes escribir el metacampo cuando se crea un nuevo cliente.
• Rellena los clientes existentes: Usa la Admin API o la Customer API para rellenar el metacampo de los clientes creados anteriormente.

Posible condición de carrera

El webhook customers/create de Shopify puede dispararse antes de que el metacampo braze.external_id se escriba en el perfil de usuario. Cuando esto ocurre:

1. Si falta el metacampo, Braze llama al endpoint configurado (paso 4.2) para obtener el ID externo.
2. Si esa llamada también falla o se agota el tiempo de espera, Braze crea un perfil de usuario temporal con el ID de cliente de Shopify como ID externo.
3. En cualquier evento posterior en el que el metacampo esté presente (como customers/update u orders/create para un evento ecommerce.order_placed), Braze detecta automáticamente la discrepancia y fusiona el perfil temporal con el ID externo correcto.

Esto significa que pueden existir perfiles duplicados temporales, pero se corrigen automáticamente. No necesitas realizar ninguna acción manual para fusionar estos perfiles.

Paso 4.2: Crea un endpoint para recuperar tu ID externo

Debes crear un endpoint GET accesible públicamente que devuelva el ID externo de Braze del cliente. Braze llama a este endpoint desde dos fuentes:

Importante

Tanto los servidores de Braze como el navegador del comprador llaman a este endpoint. El píxel web de Braze para Shopify carga la URL de tu endpoint en el navegador, por lo que la URL es pública. Sigue los pasos de Validación para devolver un ID externo solo cuando coincida con un cliente de Shopify.

Especificaciones del endpoint

Método: GET

Braze envía los siguientes parámetros a tu endpoint:

Ejemplo de endpoint

1

GET https://mystore.com/custom_id?shopify_customer_id=1234&[email protected]&shopify_storefront=dev-store.myshopify.com

Respuesta esperada

Braze espera un código de estado 200 que devuelva el ID externo en JSON:

1
2
3

{
  "external_id": "my_external_id"
}

Validación

Valida que shopify_customer_id y email_address (si está presente) coincidan con los valores del cliente en Shopify antes de devolver un ID externo. Puedes usar la Shopify Admin API o la Customer API para validar estos parámetros y recuperar el metacampo braze.external_id correcto.

Comportamiento en caso de fallo y fusión

Cualquier código de estado distinto de 200 se considera un fallo.

• Implicaciones de la fusión: Si el endpoint falla (devuelve un código distinto de 200 o se agota el tiempo de espera), Braze no puede recuperar el ID externo. En consecuencia, la fusión entre el usuario de Shopify y el perfil de usuario de Braze no se produce en ese momento.
• Lógica de reintentos: Braze puede intentar reintentos de red inmediatos estándar, pero si el fallo persiste, la fusión se aplaza hasta el siguiente evento que cumpla las condiciones (por ejemplo, la próxima vez que el usuario actualice su perfil o complete un proceso de pago).
• Compatibilidad: Para facilitar la fusión oportuna de usuarios, asegúrate de que tu endpoint tenga alta disponibilidad y gestione correctamente el campo opcional email_address.

Paso 4.3: Introduce tu ID externo

Repite el paso 4 e introduce la URL de tu endpoint después de seleccionar ID externo personalizado como tipo de ID externo de Braze.

Consideraciones

• Si tu ID externo no se genera cuando Braze envía una solicitud a tu endpoint, la integración usará de forma predeterminada el ID de cliente de Shopify cuando se llame a la función changeUser. Este paso es crucial para fusionar el perfil de usuario anónimo con el perfil de usuario identificado. Como resultado, puede haber un período temporal durante el cual existan diferentes tipos de ID externos dentro de tu espacio de trabajo.
• Cuando el ID externo esté disponible en el metacampo braze.external_id, la integración priorizará y asignará este ID externo.
  • Si el ID de cliente de Shopify se estableció previamente como el ID externo de Braze, se reemplazará con el valor del metacampo braze.external_id.

Paso 4.4: Recopila tus adhesiones voluntarias por correo electrónico o SMS desde Shopify (opcional)

Si usas los canales de correo electrónico, SMS o WhatsApp, puedes sincronizar los estados de adhesión voluntaria de marketing por correo electrónico, SMS y WhatsApp desde Shopify con Braze.

• correo electrónico
• doble adhesión voluntaria por sms
• whatsapp

Si sincronizas las adhesiones voluntarias de marketing por correo electrónico desde Shopify, Braze crea automáticamente un grupo de suscripción de correo electrónico para todos los usuarios asociados a esa tienda específica. Tienes que crear un nombre único para este grupo de suscripción.

Nota

Como se menciona en el resumen de Shopify, si quieres utilizar un formulario de captura de terceros, tus desarrolladores necesitan integrar el código del SDK de Braze. Esto te permitirá capturar la dirección de correo electrónico y el estado de suscripción global de correo electrónico a partir de los envíos de formularios. Específicamente, necesitas implementar y probar estos métodos en tu archivo theme.liquid:

• setEmail: establece la dirección de correo electrónico en el perfil de usuario
• setEmailNotificationSubscriptionType: actualiza el estado de suscripción global de correo electrónico

Usa la doble adhesión voluntaria por SMS para enviar tu mensaje de confirmación personalizado con tu marca a través de Braze en lugar del correo electrónico de confirmación de Shopify. Para activar la doble adhesión voluntaria por SMS:

1. En la página de administración de Shopify, ve a Configuración > Notificaciones > Notificaciones de clientes.
2. Desactiva la doble adhesión voluntaria de marketing para SMS.
3. Configura el SMS del checkout como adhesión voluntaria simple.
4. En la configuración de SMS de Braze, selecciona Usar doble adhesión voluntaria por SMS de Braze.

Para más información sobre la doble adhesión voluntaria por SMS de Braze y el flujo de suscriptores, consulta Resumen de Shopify.

Si envías mensajes de WhatsApp a través de Braze, también puedes sincronizar las adhesiones voluntarias de marketing por WhatsApp desde Shopify. Selecciona Recopilar suscriptores de WhatsApp y, a continuación, selecciona los grupos de suscripción de WhatsApp con los que quieres sincronizar.

Importante

Tu espacio de trabajo necesita una cuenta de WhatsApp Business conectada para tener grupos de suscripción de WhatsApp. Conecta una en Partners tecnológicos > WhatsApp.

Braze solo sincroniza el consentimiento de WhatsApp que Shopify almacena para un cliente. Una adhesión voluntaria por SMS o correo electrónico no suscribe a un cliente a WhatsApp, y no existe la doble adhesión voluntaria para WhatsApp. Para más información, consulta Adhesiones voluntarias de marketing por WhatsApp.

Paso 5: Sincronizar productos (opcional)

Puedes sincronizar todos los productos de tu tienda Shopify con un catálogo de Braze para personalizar más a fondo tus mensajes. Las actualizaciones automáticas se producen casi en tiempo real, por lo que tu catálogo refleja los detalles más actualizados de los productos. Para obtener más información, consulta Sincronización de productos de Shopify.

Paso 6: Activar canales (opcional)

Con las integraciones estándar de Shopify, puedes habilitar mensajes dentro de la aplicación y Banners desde la configuración de tu integración sin desarrollo adicional.

Mensajes dentro de la aplicación

En el paso Activar canales, selecciona los mensajes dentro de la aplicación en la configuración de tu integración. Así habilitas casos de uso como formularios de captura de correo electrónico y SMS, ventanas emergentes promocionales y cuestionarios. Para aprender a crear uno, consulta Mensajes dentro de la aplicación.

Nota

Braze recopila información de los visitantes, como direcciones de correo electrónico y números de teléfono, mediante mensajes dentro de la aplicación. Esta información se envía a Shopify. Con estos datos, los comerciantes pueden reconocer a los visitantes de su tienda y crear una experiencia de compra más personalizada. Para más información, consulta API de visitantes.

Banners

Los Banners muestran contenido personalizado en tu tienda de Shopify, como promociones, anuncios y ofertas segmentadas.

Importante

Los banners para la integración estándar de Shopify se encuentran actualmente en fase de acceso anticipado. Ponte en contacto con tu director de cuentas de Braze si te interesa participar en el acceso anticipado.

Configuración

Importante

Los Banners requieren un tema de Shopify Online Store 2.0 y la versión 6.8.0 o posterior del SDK de Braze. Durante la configuración, Braze comprueba si el tema publicado de tu tienda admite ubicaciones de banners integradas. Los temas antiguos (vintage) no admiten ubicaciones integradas, por lo que la opción Activar banners y crear ubicaciones de banners aparece deshabilitada en Activar canales. Para usar Banners, actualiza a un tema de Online Store 2.0 desde la página de administración de Shopify y, después, vuelve a la configuración de la integración para habilitar los Banners.

Selecciona Activar banners y crear ubicaciones de banners en Activar canales y guarda los cambios.

Braze crea automáticamente estas ubicaciones de Banner una vez por espacio de trabajo, y se comparten entre todas las tiendas de Shopify conectadas:

• Encabezado global
• Cuerpo de la página de inicio
• Pie de página global
• Banner de información del producto
• Cuerpo del producto
• Cuerpo de la colección
• Cuerpo del carrito
• Resumen del carrito

Nota

Si conectas varias tiendas de Shopify y habilitas los Banners en cada una, Braze crea las mismas ocho ubicaciones a la vez. Puedes usar los mismos ID de ubicación en cualquiera de tus tiendas conectadas, o en todas, simultáneamente.

Si los ID de ubicación predeterminados no se ajustan a tu configuración o quieres usar otros adicionales, tienes que crear las ubicaciones manualmente. Cada ID de ubicación debe coincidir con el que está configurado en el bloque de aplicación correspondiente de Shopify. Si cambias un ID de ubicación después del lanzamiento, actualiza el bloque de aplicación para que coincida. De lo contrario, el banner dejará de mostrarse.

Crear un Banner

Crea tu Banner en una Campaign o un Canvas con el editor de arrastrar y soltar, con HTML o a partir de una plantilla.

Nota

La vista previa del editor de Braze solo muestra el contenido del Banner. Para ver dónde aparece el Banner en tu sitio, consulta la vista previa en el editor de temas de Shopify.

Paso 1: Añade tu Banner a tu tema de Shopify

1. Lanza tu Campaign o Canvas para una audiencia pequeña, como un segmento de prueba que solo contenga tu cuenta (por ejemplo, tu propio external_id o device_id) o un grupo de prueba incluido en tu segmentación. Así puedes verificar el Banner en tu sitio en vivo sin mostrárselo a los compradores.
2. En el editor de temas de Shopify, abre la página donde quieres el Banner y selecciona Aplicaciones > Agregar bloque > Aplicaciones > Braze en el menú.

3. En la configuración del bloque de aplicación, introduce el placement_id de la ubicación que elijas (por ejemplo, global_header) de entre tus ubicaciones de Banner.

4. (Opcional) Ajusta el ancho del bloque de aplicación (% del contenedor) y añade una altura fija en píxeles. De forma predeterminada, la altura máxima se adapta al contenido de tu banner. Establece una altura fija si tu tema necesita un espacio limitado, por ejemplo, para evitar que un banner alto desplace hacia abajo el contenido de la página.

Paso 2: Prueba y lanza

Visita tu tienda como usuario de prueba para confirmar que el Banner se muestra en la ubicación correcta y con el aspecto esperado. Después, edita la segmentación de tu Campaign o Canvas para llegar a toda tu audiencia. Para medir el rendimiento, consulta Análisis de Banners.

Importante

Actualmente, los Banners no son compatibles con las páginas de agradecimiento, de estado del pedido ni de cuenta del cliente. Si te interesan estas ubicaciones concretas, haz una solicitud a través de tu equipo de cuenta de Braze.

Content Cards y conmutadores de características

Para añadir Content Cards o conmutadores de características, colabora con tus desarrolladores para insertar el código del SDK necesario directamente en tu archivo theme.liquid. Para obtener instrucciones detalladas, consulta Integración del SDK de Braze.

Notificaciones push web

Actualmente, las notificaciones push web no son compatibles con la integración de Shopify. Si te interesa web push for the Shopify integration, envía comentarios sobre el producto.

Paso 7: Finalizar la configuración

1. Después de configurar tu instalación, selecciona Finalizar la configuración.
2. Habilita la inserción de la aplicación de Braze en la configuración del tema de Shopify. Selecciona Abrir Shopify para que se te redirija a tu cuenta de Shopify y habilitar la inserción de la aplicación en la configuración del tema de tu tienda.

3. Después de habilitar la inserción de la aplicación, ¡tu configuración estará completa! Confirma que puedes ver la configuración de tu integración, el estado de la sincronización inicial de datos y tus eventos de Shopify activos.