¡Acepta pagos en tu tienda VTEX en segundos!
Requisitos
Lo único que necesitas para configurar la integración es:
- Para poder ofrecer Wompi como medio de pago, es necesario que estés registrado en alguno de nuestros planes. Si aún no lo estás, crea una cuenta con Wompi y un asesor comercial te contactará para asistirte en el proceso y brindarte las credenciales necesarias para la integración de Wompi en tu tienda VTEX.
Instalación
Para instalar Wompi en tu tienda, inicia sesión en la plataforma VTEX.
Instalación de Wompi - PSE
Dirígete a la sección Configuración de la tienda > Pago > Proveedores.
Seguidamente, haz clic en el botón Nuevo proveedor, busca Wompi-PSE en el listado y haz clic sobre esta opción.
Luego podrás ver la siguiente pantalla donde se solicitan las credenciales necesarias para la integración. Recuerda que, para realizar la integración, debes contar con las credenciales de Wompi.
- Si no las tienes, puedes encontrarlas asi: Primero, deberás iniciar sesión en el dashboard de comercios Wompi, luego dirígete a la sección Desarrollo > Programadores en el menú de la izquierda y toma las llaves públicas y privadas tanto en ambiente productivo como de prueba.
Luego, tendrás que configurar las condiciones de pago para Wompi. Dirígete a Configuración de la tienda > Pago > Configuración, ingresa a la pestaña Condiciones de pago y presiona el ícono +
Busca la opción Wompi - PSE seleccionala, activa la condición y haz clic en el botón Guardar.
Nota: los cambios en las condiciones de pago pueden tardar hasta 10 minutos para aplicarse en el checkout de tu tienda VTEX.
Instalación de Nequi, Botón Bancolombia y Efectivo en Corresponsales
Primero debes configurar el proveedor de pagos, para esto dirígete a la sección Configuración de la tienda > Proveedores > Nuevo proveedor.
Busca Wompi en el listado y haz clic sobre dicha opción para continuar el proceso.
Luego debes:
- Ingresar las credenciales de tu cuenta Wompi.
La llave pública corresponde a la Clave de aplicación y la llave privada corresponde al Token de aplicación. Recuerda ingresar las credenciales según el modo
- Si no las tienes, puedes encontrarlas asi: Primero, deberás iniciar sesión en el dashboard de comercios Wompi, luego dirígete a la sección Desarrollo > Programadores en el menú de la izquierda y toma las llaves públicas y privadas tanto en ambiente productivo como de prueba.
- Personalizar el nombre del proveedor si lo deseas, seleccionar si deseas operar en modo de prueba o no y seleccionar el país donde opera tu tienda.
Importante: En caso de operar en modo prueba, recuerda ingresar credenciales Wompi de pruebas en el primer paso. En caso de deshabilitar el modo prueba ingresar credenciales Wompi de producción.
Una vez que hayas finalizado haz clic sobre el botón Guardar.
- Luego desde Configuración de la tienda > Pago > Configuración ingresa a la pestaña de Pagos personalizados, en el apartado Pagarés que se encuentra de primero en la lista haz clic sobre Configurar.
Asignar el nombre NEQUI, Botón Bancolombia o Efectivo en Corresponsales y posteriormente guardar. Repetir este proceso para cada servicio
Nota: es importante darle a cada pago personalizado el nombre antes indicado. Si se proporciona un nombre diferente no se podrá garantizar una gestión eficiente de las transacciones y la experiencia se vería afectada tanto para los usuarios como para los clientes.
- Luego, tendrás que configurar las condiciones de pago para cada uno de los servicios. Dirígete a la pestaña Condiciones de pago y presiona el ícono +. selecciona el proveedor Wompi que configuraste en pasos anteriores.
En el apartado Pagos personalizados busca el servicio que deseas configurar y seleccionalo. Si no puedes ver este apartado reduce el zoom hasta que puedas verlo al final de la lista.
Activa la condición y haz clic en el botón Guardar para finalizar la configuración.
Repite este proceso para configurar cualquiera de los servicios (Nequi, Botón Bancolombia,Efectivo en Corresponsales)
Nota: los cambios en las condiciones de pago pueden tardar hasta 10 minutos para aplicarse en el checkout de tu tienda VTEX.
Instalación de la aplicación Banks for PSE
A continuación, se detalla el paso a paso para instalar la aplicación Banks for PSE y activar el listado de bancos:
- Debe descargar e instalar VTEX IO CLI. Visualice más detalles en la siguiente documentación.
- Ubique la Terminal (de Windows u otro sistema operativo) en su PC y ejecute con permisos de administrador haciendo clic con el botón derecho en el icono de la Terminal y seleccionando Ejecutar como administrador.
- Con la VTEX IO CLI instalada, use el comando
vtex loginseguido del nombre de la cuenta de VTEX para entrar en su cuenta VTEX. Esto abrirá una ventana de su navegador que solicitará sus credenciales.
$ vtex login {Nombre de cuenta VTEX}
- Una vez que haya iniciado sesión, puede cerrar la ventana del navegador y volver a la Terminal, puede usar el comando
vtexwhoamipara verificar cuál cuenta y workspace están siendo utilizados por la Terminal. - Escriba vtex y presione Enter para comprobar la instalación de VTEX IO CLI.
- Proceda a instalar Banks for PSE escribiendo el comando
vtex install vtex.banks-for-pse@0.3.1a través de la Terminal usando el VTEX IO CLI. Confirme los cambios, escriba y o Y para confirmar la instalación. Se visualizará un mensaje de éxito de la instalación.
- Dirígete a su tienda VTEX, consulte el apartado Aplicaciones / Gestión de aplicaciones. Visualizará la aplicación Banks for PSE instalada. Seguidamente, haga clic en la opción Configuración.
- En la sección Connector used to process the PSE seleccione Wompi y finalmente presione el botón GUARDAR.
Instalación de Wompi - Cards
Primero debes configurar el proveedor de pagos, para esto dirígete a la sección Configuración de la tienda -> Proveedores -> Nuevo proveedor.
Busca Wompi en el listado y haz clic sobre dicha opción para continuar el proceso.
Luego debes:
- Ingresar las credenciales de tu cuenta Wompi.
La llave pública corresponde a la Clave de aplicación y la llave privada corresponde al Token de aplicación.
- Si no las tienes, puedes encontrarlas asi: Primero, deberás iniciar sesión en el dashboard de comercios Wompi, luego dirígete a la sección Desarrollo > Programadores en el menú de la izquierda y toma las llaves públicas y privadas tanto en ambiente productivo como de prueba.
- Personalizar el nombre del proveedor si lo deseas, seleccionar si deseas operar en modo de prueba o no y seleccionar el país donde opera tu tienda.
Importante: En caso de operar en modo prueba, recuerda ingresar credenciales Wompi de pruebas en el primer paso. En caso de deshabilitar el modo prueba ingresar credenciales Wompi de producción.
Una vez que hayas finalizado haz clic sobre el botón Guardar.
Finalmente deberás configurar las condiciones de pago para Wompi. Dirígete a la pestaña Condiciones de pago y presiona el ícono +.
Podrás configurar pago por cuotas o al contado de la siguiente manera:
- Pago en cuotas Selecciona la marca que deseas ofrecer a tus clientes.
Personaliza un nombre si lo deseas, Activa la condición, selecciona el nombre del proveedor que configuraste previamente, selecciona la opción En cuotas e ingresa los datos correspondientes y finalmente guarda los cambios.
Una vez hecho esto, tus clientes podrán realizar sus pagos en cuotas con tarjeta usando Wompi mediante la marca configurada.
- Pago al contado Repite el mismo proceso de Pago en cuotas pero en lugar de seleccionar la opción En cuotas selecciona Al contado.
Configuración de webhook de notificaciones de estado
Para configurar la URL de Eventos y recibir las notificaciones de estado correctamente, te detallamos los siguientes pasos:
- Inicia sesión en Wompi con tus credenciales. Seguidamente, dirígete a la sección Desarrolladores y visualiza el apartado Seguimiento de transacciones.
- Agrega la URL https://wompi-vtex-events.conexa.ai/ipn/event en el campo URL de Eventos y presiona el botón Guardar.
Nota: si activas el modo de pruebas, la URL que debes configurar es la siguiente: https://wompi-vtex-events-stage.conexa.ai/ipn/event.
¡Listo! El proceso de configuración ha finalizado correctamente.
Tutoriales
Credenciales de Wompi y tu tienda VTEX
En la siguiente imagen explicamos cómo obtener tus credenciales de Wompi y tu tienda VTEX.
Instalación de la integración
En la siguiente imagen explicamos detalladamente el proceso de instalación y configuración, así podrás integrar fácilmente Wompi a tu tienda VTEX.
Realizar una compra y visualizar en tu tienda VTEX y Wompi
En la siguiente imagen te describimos cómo se podrá realizar una compra desde tu tienda y su visualización en tu tienda VTEX y en el panel de Wompi.
Modo Prueba
Para activar el modo de pruebas de Wompi en VTEX, te detallamos los siguientes pasos:
- Inicia sesión en Wompi con tus credenciales.
- Dirígete a la sección Desarrolladores y presiona el botón Activar modo de pruebas.
- Usa las credenciales que se visualizan en la sección Llaves del API para integración técnica en tu integración.
Si ya no deseas usar el modo de pruebas presiona el botón Desactivar modo de pruebas y usa las credenciales productivas en tu integración.
Nota: cada ambiente tiene un par de llaves relacionado, cada una de estas llaves tiene un prefijo prod o test, que representan el ambiente de producción o sandbox respectivamente, con el cual puedes identificar fácilmente a qué ambiente corresponde.
Flujo de clientes
Para realizar un pago, una vez elegido el producto y agregado al carrito, tus clientes visualizarán la opción de Wompi como medio de pago disponible.
Wompi - Efectivo en Corresponsales
Corresponsales Bancarios es una forma de pago offline, es decir, se realiza de forma presencial.
El comprador selecciona el método de pago en el checkout de tu tienda VTEX y presiona el botón Comprar ahora.
Seguidamente deberá aprobar los términos y condiciones y presionar el botón Continuar con el pago.
Se mostrará un código único. El comprador deberá ir a un Corresponsal Bancario y usando el código de referencia le permitirá finalizar la operación. El estado de la transacción deberá visualizarse actualizado.
Wompi - PSE
PSE es la red bancaria en Colombia que le permitirá al comprador hacer una transferencia de dinero eligiendo cualquier banco de preferencia.
El comprador selecciona el método de pago PSE y el banco de su preferencia en el checkout de tu tienda VTEX.
Presione el botón Continuar para hacer el pago y este redirecciona a la experiencia de cada banco para continuar con la transacción.
Finalizada la operación se retorna al checkout de tu tienda VTEX con la confirmación del pedido.
Wompi - Nequi
Nequi es una billetera bancaria. El comprador se debe identificar con el número telefónico de su cuenta Nequi y seleccionar el medio de pago en el checkout.
Luego debe presionar el botón Comprar ahora.El comprador recibirá una notificación para confirmar la transacci ón y una vez confirmada finalizará la compra.
Botón Bancolombia
El comprador selecciona el método de pago Botón Bancolombia en el checkout de tu tienda VTEX.
Presiona el botón Comprar ahora y se redirecciona a la experiencia del banco para continuar con la transacción.
Finalizada la operación se retorna al checkout de tu tienda VTEX con la confirmación del pedido.
Wompi - Cards
El comprador selecciona Tarjeta de crédito o Tarjeta de débito como medio de pago.
Luego debe ingresar los datos de la tarjeta, cantidad de cuotas en caso de que aplique y finalizar la compra.
Finalizada la operación se retorna al checkout de tu tienda VTEX con la confirmación del pedido.
Flujo de administrador
Como administrador de tu tienda, podrás visualizar un listado de tus transacciones con el medio de pago utilizado.
De igual forma, desde el listado de pedidos puedes consultar el detalle de los mismos: observarás si el pago fue realizado mediante Wompi y el id de transacción correspondiente.
También, como commerce desde el dashboard de Wompi, podrás visualizar el pago realizado.
Preguntas frecuentes
1. ¿Por qué no se muestra el medio de pago en mi tienda?
Las credenciales usadas en el proceso de configuración no son las correctas. Te recomendamos asegurarte que las credenciales configuradas son correctas y que se hayan realizado todos los pasos mencionados en esta documentación. Si el problema persiste, contacta a soporte.
2. ¿Cómo puedo visualizar más información de mis transacciones?
Desde tu tienda VTEX y/o panel de Wompi, podrás obtener más detalles sobre tus transacciones.
3. ¿El estado del pago realizado se actualiza en mi tienda?
Una vez el comprador realice el pago de la orden, deberías visualizar el pago aprobado en tu tienda.
4. ¿Dónde puedo obtener más información sobre el registro de afiliaciones de gateway?
Visita Registrar afiliaciones de gateway desde Tutoriales y Soluciones de la plataforma VTEX.
5. ¿Dónde puedo obtener más información para configurar condiciones de pago?
Visita Configurar condiciones de pago desde Tutoriales y Soluciones de la plataforma VTEX.
6. ¿Puedo dejar de ofrecer el medio de pago?
Sí, siempre que desees puedes desactivar el medio de pago, simplemente dirígite a la sección Configuración de la tienda -> Pago -> Configuración, haz clic en la pestaña Condiciones de pago y desactiva la condición de pago para Wompi. Luego, desde la misma pantalla puedes reactivar la condición si deseas volver a usarlo en tu tienda VTEX.
