DOCS

Integración personalizada

Integración personalizada

Cree una integración de Checkout de extremo a extremo en su sitio personalizado.

Lista de verificación de integración 

Siga esta lista de verificación completa para configurar su cuenta de Zonos Dashboard e integrar Zonos Checkout en su sitio o plataforma personalizada.

Para comenzar, contacte a nuestro equipo de ventas para crear una cuenta y firmar un acuerdo. Una vez firmado el acuerdo, recibirá dos microdepósitos en su cuenta que deben verificarse.

Envíe por correo electrónico estos montos de microdepósito a accounting@zonos.com con el ID de tienda de Dashboard (con copia a su representante de ventas).

Una vez verificados, sus datos bancarios se mostrarán en Dashboard -> Settings -> Billing.

Después de crear su cuenta de Zonos, deberá configurar los ajustes en Dashboard para garantizar que Checkout funcione correctamente con su tienda. Esta sección cubre todas las configuraciones esenciales de Dashboard.

Configurar pagos 

Conecte una cuenta bancaria para recibir pagos oportunos de Checkout. Los pagos se procesan diariamente con un retraso de 2 días desde el cobro del pago. Para hacerlo, siga estos pasos:

  1. Navegue a Dashboard -> Settings -> Checkout settings .
  2. Haga clic en Add bank account
  3. Será dirigido a un portal de Stripe para completar la configuración y proporcionar la siguiente información:
    • Información de la cuenta bancaria.
    • EIN de la empresa.
    • Número de Seguro Social de un propietario con el 25 % de la empresa. Para más detalles sobre por qué esto es obligatorio, consulte la documentación de Stripe.

Nota: Si necesita actualizar su calendario de pagos, contacte a support@zonos.com

Configurar dominios permitidos 

El script de Zonos JS requiere una lista de dominios permitidos por motivos de seguridad. Esto evita que sitios no autorizados carguen el script y garantiza que solo se ejecute en sus dominios aprobados. Sin esta configuración, el script devolverá errores de permiso.

Para configurarlo:

  1. Navegue a Dashboard -> Settings -> Checkout settings
  2. En URLs, agregue su dominio completo y cualquier subdominio donde se usará Checkout. Por ejemplo, si su dominio es example.com, debe agregar example.com y test.example.com.

Personalizar ajustes de marca 

Configure sus ajustes de marca en Dashboard para que coincidan con el aspecto de su tienda.

Para hacerlo, siga estos pasos:

  1. Navegue a Dashboard -> Settings -> Checkout settings -> Branding
  2. Configure los siguientes ajustes:
    • Logo.
    • Color de marca y de acento.
    • Tema, estilo y fuente.

Para más información sobre los ajustes de marca, consulte nuestra documentación.

Conectar un transportista de envío 

Para cotizar el envío en el checkout, deberá conectar un transportista de envío a su cuenta de Zonos. Esto le permitirá habilitar niveles de servicio de envío específicos en el checkout.

Para conectar un transportista de envío, siga estos pasos:

  1. Navegue a Dashboard -> Settings -> Shipping -> Rates
  2. Haga clic en Add carrier
  3. Siga las instrucciones de configuración del transportista.

Para más detalles sobre la conexión de cuentas de transportistas, consulte nuestra documentación.

Configurar zonas de envío 

Las zonas de envío le permiten configurar qué transportistas y niveles de servicio están disponibles para diferentes regiones del mundo.

Para configurar zonas de envío, siga estos pasos:

  1. Navegue a Dashboard -> Settings -> Shipping -> Locations
  2. Haga clic en New zone
  3. Ingrese un nombre de zona y seleccione los países a los que desea enviar.
  4. Seleccione el transportista y el nivel de servicio que desea ofrecer.

Para más detalles sobre zonas de envío, consulte nuestra documentación.

Configurar un país de origen y código HS de respaldo 

El país de origen y el código HS se utilizan para calcular aranceles e impuestos con precisión.

Si no proporciona un país de origen o código HS específico, usaremos los valores de respaldo configurados en Dashboard.

Para configurar su país de origen y código HS de respaldo:

  1. Navegue a Dashboard -> Settings -> Shipping -> Catalog.
  2. Para el país de origen, seleccione el país donde se fabrica la mayoría de sus productos.
  3. Para el código HS, ingrese el código HS de su producto más común. Si no tiene un código HS, navegue a Classify en Dashboard e ingrese el nombre y la descripción de su producto para generar un código HS preciso.

El fragmento de Zonos JS es una integración de JavaScript del lado del cliente que habilita la funcionalidad de checkout global en su sitio. Sirve como puente entre su plataforma de comercio electrónico y los servicios de Zonos, gestionando:

  • Experiencia de Checkout: Renderiza la interfaz de checkout y procesa los pagos.
  • Servicios de ubicación: Detecta la ubicación del visitante y gestiona la conversión de moneda.
  • Integración del carrito: Se conecta con su carrito y sistema de pedidos existentes.
  • Seguridad: Valida dominios y autentica solicitudes de API.

El fragmento se carga de forma asincrónica para evitar cualquier impacto en el rendimiento de su sitio. Se inicializa con las credenciales de API de su tienda y gestiona todas las interacciones del lado del cliente de forma segura. La implementación está diseñada para ser no intrusiva, requiriendo cambios mínimos en su flujo de checkout existente.

A continuación se muestra un ejemplo completo que incluye la carga del script, la inicialización y el manejo de eventos como referencia al integrar Checkout.

1
  1. Pase los ID correspondientes a través de su customHTML de Checkout para que el relé sepa contra qué propiedad/píxel disparar:
1

Para instrucciones paso a paso de iframe, la referencia completa de eventos (incluido el mapeo de carga útil de purchase / Purchase) y consejos de depuración, consulte:

Para sincronizar pedidos entre su sistema y Zonos Dashboard, implemente estas llamadas a la API y webhooks:

Mutaciones obligatorias 

MutaciónDescripción
orderUpdateAccountOrderNumberSincroniza su número de cuenta nativo con Dashboard. Docs →
orderAddTrackingNumberObligatoria solo si no imprime etiquetas en Dashboard. Garantiza que el seguimiento se muestre en Dashboard para que Zonos pueda garantizar sus cálculos de landed cost. Docs →

Webhooks obligatorios 

WebhookDescripción
ORDER_CREATEDNecesario para enviar pedidos de Checkout a su plataforma nativa. Docs →
ORDER_STATUS_CHANGEDMantiene su sistema sincronizado con Zonos cuando cambian los estados de los pedidos (p. ej., cumplido, cancelado). Docs →

Antes de poner en marcha su integración de Checkout, es importante probar exhaustivamente todos los aspectos de la integración para garantizar una experiencia fluida para el cliente. Esto incluye probar el flujo de checkout, el procesamiento de pagos, la creación de pedidos y la funcionalidad de webhooks.

Siga nuestra guía de pruebas para verificar que su integración funciona correctamente e identificar y corregir cualquier problema antes de lanzar a producción.

A continuación se presentan algunas preguntas frecuentes sobre el proceso de integración.

¿Cómo maneja Zonos la confirmación del pedido? 

Configure la experiencia posterior a la compra en Dashboard -> Settings -> Checkout settings en Success page type. Hay tres opciones disponibles:

  • Show Zonos success page (predeterminado, recomendado) — Zonos muestra una página de agradecimiento integrada después de realizar el pedido. La página siempre se muestra, incluso si el pedido no se importa en su sistema, para que el comprador siempre reciba una confirmación.
  • Redirect to a success page — Zonos espera en una breve pantalla de «Pedido completado» hasta que se crea el pedido, luego redirige a su URL de éxito configurada con zOrderNumber (y orderId para carritos heredados) agregados como parámetros de consulta.
  • Close the checkout modal — Zonos cierra su modal una vez que se captura el pago. Si también configura una URL de éxito, Zonos redirige a esa URL inmediatamente después de que Stripe recauda el pago —sin esperar a que se cree el pedido— y agrega zonosCheckoutSessionId como parámetro de consulta. Use esta opción cuando desee la transferencia más rápida de vuelta a su propia página de éxito.

Buscar el pedido desde zonosCheckoutSessionId 

Cuando usa Close the checkout modal con una URL de redirección, el pedido puede tardar unos segundos en asociarse a la sesión de checkout después de la redirección. Lea zonosCheckoutSessionId de la URL y consulte la consulta GraphQL checkoutSession desde su servidor usando su token de credencial secreto hasta que el pedido esté listo. Nunca llame a esto desde el navegador — el token de credencial secreto debe permanecer en el servidor.

1query getCheckoutSession($id: String!)
2checkoutSession )
3order
4id

Envíe la consulta a https://api.zonos.com/graphql con su token de credencial secreto de Dashboard -> Settings -> Integrations pasado como encabezado de solicitud credentialToken.

¿Puedo recibir una notificación cuando se crea un pedido? 

Sí. Si desea recibir notificaciones cuando se crea un pedido, en Dashboard, en la sección Email de Checkout settings, puede ingresar la dirección de correo electrónico de los miembros del equipo que deben recibir notificación cuando se crea, envía o cancela un pedido.

¿Fue útil esta página?