Botones de pago

Pago directo, en el punto de compra.

Añade un botón a tu sitio web, landing page o campaña y abre el checkout sin convertir la página en un e-commerce.

Documentación ↗

Un clic hasta el checkout.

El cliente pasa al pago sin perder el contexto de la página.

Conversión con menos pasos

Un botón pequeño.
Un recorrido completo.

El botón conecta páginas de campaña, sitios institucionales, páginas de producto y ofertas puntuales con un checkout transparente. La interfaz puede reflejar la identidad visual de la operación y la confirmación del pago sigue conectada al flujo técnico de IOPAY.

01

Pago en el contexto adecuado.

Lleva al cliente del contenido o de la oferta directamente al cobro, sin crear una tienda completa para cada campaña.

02

Checkout personalizable.

Define los colores primario y secundario y asocia el logotipo de la empresa a la experiencia de pago.

03

Pix, tarjeta y boleto.

Activa los medios de pago habilitados para la operación en un mismo recorrido de checkout.

04

Eventos para tu operación.

Usa webhooks para actualizar el pedido, el CRM, el ERP, las automatizaciones o cualquier sistema tras los cambios de estado.

De la intención al pago

Menos camino entre querer y pagar.

Los botones de pago son especialmente útiles cuando la compra nace fuera de un checkout tradicional: campañas, lanzamientos, páginas promocionales, suscripciones, eventos, contenido comercial y recorridos que necesitan un punto de cobro claro.

campañasCTA → checkoutConvierte una llamada comercial en un camino directo al pago.
marcaColores + logotipoPersonaliza la experiencia para mantener la continuidad visual durante la compra.
integraciónHTML + JavaScriptEl botón se renderiza a partir de un formulario sencillo y del script del checkout transparente.
operaciónWebhooksUsa eventos para confirmar y sincronizar el estado real del pago en tus sistemas.
Integración

Un formulario HTML y el checkout queda conectado.

La estructura siguiente sigue el modelo documentado por IOPAY para el botón de pagos. Los valores de credencial y el identificador de la integración deben sustituirse por los datos de tu cuenta y entorno.

<!-- Botão de Pagamento IOPAY -->
<form id="_iopay_checkout"
      action="https://checkout.iopay.dev/app/pay/SEU_ID"
      method="post"
      target="_iopay_frame"
      onsubmit="return false;">

  <input type="hidden" name="integration" value="transparent">
  <input type="hidden" name="business" value="SEU_EMAIL">
  <input type="hidden" name="reference_id" value="PEDIDO_1024">
  <input type="hidden" name="amount" value="199.00">

  <!-- Personalização opcional -->
  <input type="hidden" name="io_config_primary_color" value="#111111">
  <input type="hidden" name="io_config_secondary_color" value="#6547ff">

  <button onclick="iopay()" name="payWithIO">
    Pagar agora
  </button>
</form>

<link href="https://checkout.iopay.dev/checkout/assets/css/front.checkout.transparent.iopay.css" rel="stylesheet">
<script src="https://checkout.iopay.dev/checkout/assets/js/front.checkout.transparent.iopay.min.js"></script>
Cómo funciona

Del HTML al pago confirmado.

El botón es simple en la página, pero sigue integrado en la infraestructura de pagos y eventos de IOPAY.

01
Habilita la operación.La cuenta debe estar habilitada para Botones de Pago y recibir los datos de integración aplicables.
02
Configura el formulario.Indica la integración transparente, la referencia del pedido, el valor y los demás datos que quieras rellenar previamente.
03
Personaliza la experiencia.Los colores pueden definirse en el propio formulario; el logotipo se configura en el área de Pagos Online de la cuenta.
04
Confirma por webhook.La URL de retorno orienta la navegación del cliente. La confirmación del pago debe hacerse mediante los eventos enviados por webhook.
Abrir documentación completa ↗
Dónde usarlo

Coloca el pago en el punto de mayor intención.

El mismo mecanismo puede respaldar recorridos comerciales muy distintos, siempre que exista una página capaz de cargar el formulario y el JavaScript del checkout.

01

Landing pages.

Campañas, lanzamientos, webinars, inscripciones, preventas y ofertas de performance.

02

Páginas de producto.

Crea una ruta directa al pago incluso cuando no haya un catálogo completo o un carrito tradicional.

03

Campañas y medios.

Conecta anuncios, contenido, influencers y páginas promocionales con un cobro específico y medible.

Botones de pago IOPAY

Una integración pequeña para abrir una nueva ruta de conversión.

Abre tu cuenta, habilita el producto e incorpora el cobro directamente en las páginas donde ya están tus clientes.