Widget
Implementación del Widget
El widget de PaymentsWay es un checkout embebido que se abre directamente dentro de tu página — el cliente paga sin salir de tu sitio. A diferencia del botón de pago, no hay redirecciones: el formulario aparece sobre tu propio sitio como una capa flotante.
El cliente paga sin salir de tu sitio. Mejor experiencia de compra.
CSS + JS + inicialización. Compatible con cualquier framework.
Puedes cambiar el monto dinámicamente antes de abrir el widget.
Soporta suscripciones con intervalo configurable.
Widget vs Botón de Pago
| Característica | Widget | Botón de Pago |
|---|---|---|
| Redirección | No — se abre en tu página | Sí — va al portal PW |
| Instalación | CSS + JS + 3 líneas | Solo un formulario HTML |
| Experiencia | Checkout flotante | Página completa |
| Pagos recurrentes | ✓ Soportado | ✗ No disponible |
| Monto dinámico | ✓ updateAmount() | ✗ Fijo en el form |
El orden de carga importa: primero el CSS, luego el JS, finalmente el script de inicialización.
1 — Hoja de estilos
<link rel="stylesheet"
href="https://merchant.paymentsway.co/assetsWidget/css/index.css" />2 — Script (final del body)
<script src="https://merchant.paymentsway.co/assetsWidget/js/index.js"></script>3 — Inicializar
const checkout = new widgetCheckout({
merchant_id : 'tu-merchant-id',
form_id : 'tu-form-id',
terminal_id : 'tu-terminal-id',
order_number : generateOrderNumber(7),
amount : '50000',
currency : 'COP',
order_description: 'Compra en mi tienda',
apikey : 'tu-api-key',
ip : '0.0.0.0',
});
// Actualizar monto dinámicamente
checkout.updateAmount(75000);Parámetros
| Campo | Tipo | Descripción | Req. |
|---|---|---|---|
merchant_id | string | ID del comercio desde la consola. | Sí |
form_id | string | ID del botón de pago. | Sí |
order_number | string | Identificador único de la orden. | Sí |
amount | string | Monto a cobrar. | Sí |
currency | string | COP, USD o EUR. | Sí |
apikey | string | API Key de la consola. | Sí |
redirect | string | URL de retorno al finalizar. | No |
additionalData | object | Datos extra que retorna el webhook. | No |
Botón de pago abierto
El botón de pago abierto es una variación del botón estándar donde el cliente elige cuánto pagar. Tú defines un rango de montos y él decide. Ideal para donaciones, recargas, propinas o cualquier cobro donde el precio no es fijo.
Modo de uso
Esta sección describe la experiencia que vive el cliente al usar el widget — desde que hace clic en "Pagar" hasta que recibe la confirmación, sin salir de tu sitio web en ningún momento.