> ## Documentation Index
> Fetch the complete documentation index at: https://docs.jelou.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Uso y configuración

> Agrega el nodo de Wompi a tu flujo en Canvas, configura sus inputs y prueba pagos en Sandbox.

Una vez conectada la integración, el nodo de **Wompi** queda disponible en Canvas y te permite crear experiencias de cobro con **WebView embebido** dentro del flujo conversacional.

<Tip>
  Si todavía no instalaste la integración, sigue primero [Conectar en Brain Studio](/guides/integraciones/pagos/proveedores/wompi/conectar-en-brain-studio).
</Tip>

***

## Agregar el nodo al Canvas

<Steps>
  <Step title="Abrir tu flujo en Canvas">
    Abre en Brain Studio el flujo donde quieres incorporar el cobro con Wompi.
  </Step>

  <Step title="Agregar el nodo Wompi">
    Agrega **Wompi** desde la barra de herramientas de **Canvas**, en el nodo **Pagos**, o desde los proveedores de pago disponibles una vez instalada la integración.

    El punto exacto puede variar según si iniciaste la instalación desde Marketplace, Jelou Agent, el nodo de pagos en Canvas o un template.
  </Step>

  <Step title="Conectar el nodo al punto de cobro">
    Conecta el nodo de Wompi después de que el flujo ya tenga el monto, los datos del comprador y la confirmación de compra.
  </Step>

  <Step title="Abrir el panel de configuración">
    Selecciona el nodo para abrir el panel lateral derecho y completar los **inputs** y revisar las **salidas** disponibles.

    <Frame caption="Nodo Wompi con el panel lateral de configuración abierto">
      <img src="https://mintcdn.com/jelouai/qfuCOV36dV96m5-d/assets/images/integraciones/pagos/wompi-nodo-sidebar-configuracion.png?fit=max&auto=format&n=qfuCOV36dV96m5-d&q=85&s=850d7337fa4eb41635165b44974f9724" alt="Nodo Wompi en Canvas con el panel lateral de configuración abierto" width="1024" height="641" data-path="assets/images/integraciones/pagos/wompi-nodo-sidebar-configuracion.png" />
    </Frame>
  </Step>
</Steps>

***

## Configurar el nodo

<Tabs>
  <Tab title="Inputs">
    ### Datos del pago

    <AccordionGroup>
      <Accordion title="Personalizar textos botón de pago" icon="message">
        <ParamField body="Personalizar textos botón de pago" type="boolean" default="false">
          Permite definir el mensaje que acompaña el botón de pago en la conversación.

          Si se activa, habilita **Header**, **Body** y **Footer** cuando estén disponibles en tu versión del nodo.
        </ParamField>
      </Accordion>

      <Accordion title="Header" icon="heading">
        <ParamField body="Header" type="string">
          Título del mensaje del botón de pago.

          Se muestra cuando **Personalizar textos botón de pago** está activo y el campo está disponible en tu versión del nodo.
        </ParamField>
      </Accordion>

      <Accordion title="Body" icon="align-left">
        <ParamField body="Body" type="string">
          Texto principal del mensaje del botón de pago.

          Se muestra cuando **Personalizar textos botón de pago** está activo y el campo está disponible en tu versión del nodo.
        </ParamField>
      </Accordion>

      <Accordion title="Footer" icon="minus">
        <ParamField body="Footer" type="string">
          Texto de cierre del mensaje del botón de pago.

          Se muestra cuando **Personalizar textos botón de pago** está activo y el campo está disponible en tu versión del nodo.
        </ParamField>
      </Accordion>

      <Accordion title="Motivo de pago" icon="file-lines">
        <ParamField body="Motivo de pago" type="string" required>
          Texto descriptivo del cobro. Ejemplos: número de orden, producto, servicio o referencia interna.
        </ParamField>
      </Accordion>

      <Accordion title="Monto sujeto a impuestos" icon="receipt">
        <ParamField body="Monto sujeto a impuestos" type="number" required>
          Monto sobre el que aplica IVA.
        </ParamField>
      </Accordion>

      <Accordion title="Monto libre de impuestos" icon="dollar-sign">
        <ParamField body="Monto libre de impuestos" type="number" required>
          Monto exento de impuestos. Si no aplica, usa `0`.
        </ParamField>
      </Accordion>

      <Accordion title="Nombre completo comprador" icon="user">
        <ParamField body="Nombre completo comprador" type="string" required>
          Nombre completo del comprador. Idealmente debe venir desde una variable capturada previamente en el flujo.
        </ParamField>
      </Accordion>

      <Accordion title="Email comprador" icon="envelope">
        <ParamField body="Email comprador" type="string" required>
          Correo del comprador que usará el checkout.

          En Sandbox puede ser un correo de prueba o controlado. En producción debe ser el email real del comprador.
        </ParamField>
      </Accordion>
    </AccordionGroup>

    ### Avanzado

    <AccordionGroup>
      <Accordion title="Ambiente" icon="server">
        El bloque **Ambiente** muestra si Wompi opera en **Desarrollo** o **Producción**.

        Si la integración está en **Desarrollo**, desde ahí puedes iniciar el flujo para **Pasar a producción**.

        Si la integración está en **Producción**, el bloque refleja que Wompi ya opera con credenciales productivas.

        <Warning>
          El ambiente depende de las credenciales instaladas. No pases a producción sin preparar credenciales productivas y configurar la URL de Eventos correspondiente en Wompi.
        </Warning>
      </Accordion>

      <Accordion title="Experiencia de pago" icon="window">
        <ParamField body="Experiencia de pago" type="string" default="WebView">
          Indica que el checkout de Wompi se abre como **WebView embebido** dentro de la experiencia conversacional.
        </ParamField>
      </Accordion>

      <Accordion title="Expiración del botón de pagos [minutos]" icon="clock">
        <ParamField body="Expiración del botón de pagos [minutos]" type="number">
          Define cuánto tiempo permanece vigente el botón de pago después de enviarlo.

          Los valores disponibles dependen de la configuración visible en Brain Studio.
        </ParamField>
      </Accordion>

      <Accordion title="Moneda" icon="coins">
        <ParamField body="Moneda" type="string" required>
          Define la moneda del cobro.

          Para Wompi Colombia, normalmente usarás `COP`.
        </ParamField>
      </Accordion>

      <Accordion title="Porcentaje de IVA" icon="percent">
        <ParamField body="Porcentaje de IVA" type="number">
          Define el porcentaje de IVA aplicado a la operación de cobro.
        </ParamField>
      </Accordion>

      <Accordion title="Metadata del pago" icon="tag">
        <ParamField body="Metadata del pago" type="string">
          Campo opcional para guardar referencia interna como ID de orden, correlativo, user ID o booking ID.
        </ParamField>
      </Accordion>

      <Accordion title="Guardar resultado como" icon="database">
        <ParamField body="Guardar resultado como" type="string">
          Define el nombre de la variable donde Brain Studio guardará el JSON completo de respuesta del nodo.
        </ParamField>

        <Tip>
          Útil para trazabilidad, validaciones posteriores o decisiones del flujo.
        </Tip>
      </Accordion>
    </AccordionGroup>
  </Tab>

  <Tab title="Outputs">
    <AccordionGroup>
      <Accordion title="Pago exitoso" icon="circle-check">
        Se activa cuando Wompi confirma que la transacción fue aprobada.

        Recomendaciones:

        * confirmar la orden
        * emitir comprobante o actualizar estado en sistemas externos
      </Accordion>

      <Accordion title="Pago pendiente" icon="clock">
        Se activa cuando la transacción queda en proceso o requiere confirmación posterior.

        Recomendaciones:

        * informar al usuario con claridad
        * evitar crear un segundo cobro mientras se resuelve el estado
        * esperar actualización por evento cuando corresponda
      </Accordion>

      <Accordion title="Mensaje de pago enviado" icon="paper-plane">
        Se activa cuando el mensaje con el botón de pago se envía correctamente en la conversación.

        Esta salida **no** confirma el pago. Solo indica que el mensaje con el botón de pago fue enviado correctamente en la conversación.

        Puedes conectar esta salida a un **AI Agent de soporte post-envío del mensaje de pago** para asistir al usuario mientras decide abrir el checkout o si tiene dudas antes de pagar.

        **Recomendaciones:**

        * resolver dudas sobre cómo abrir el botón de pago
        * ayudar si el WebView no carga o el usuario no entiende el paso
        * evitar crear un nuevo cobro sin contexto
        * no confirmar pagos desde esta salida

        **Ejemplo de prompt (referencial):**

        ```txt theme={null}
        Actúa como “Soporte de Pago”, un asistente breve para ayudar al usuario después de recibir un mensaje con botón de pago dentro de WhatsApp.

        Contexto:
        El usuario acaba de recibir un mensaje con botón de pago para abrir un checkout en WebView. Tu rol es responder dudas simples antes de que el usuario complete el pago.

        ────────────────────
        INTERRUPCIÓN INMEDIATA
        ────────────────────
        Si el último mensaje o evento recibido contiene señales de resultado de pago, NO respondas.

        Señales de resultado de pago:
        - pago exitoso, pago aprobado, pago completado
        - pago pendiente
        - pago fallido, rechazado, declinado o denegado
        - error de pago
        - confirmación automática del proveedor
        - recibo, comprobante, número de operación, transaction ID, payment ID
        - mensajes con estructura de comprobante, montos, método de pago o estado final

        Cuando detectes cualquiera de estas señales, detén tu ejecución inmediatamente. El resultado del pago debe ser manejado por las salidas oficiales del nodo de pago, no por este agente.

        ────────────────────
        COMPORTAMIENTO
        ────────────────────
        - Si el usuario no hizo una pregunta o no reportó un problema, no respondas.
        - Si el usuario tiene una duda, responde de forma breve, clara y útil.
        - No confirmes pagos.
        - No inventes estados de pago.
        - No recalcules montos.
        - No prometas reversos, aprobaciones, reembolsos ni tiempos de acreditación.
        - No generes nuevos links ni nuevos cobros.
        - Si el usuario necesita ayuda humana, indícale que será derivado según el flujo de soporte definido por el comercio.

        ────────────────────
        QUÉ PUEDES RESPONDER
        ────────────────────
        Puedes ayudar con:
        - cómo abrir el botón de pago
        - qué hacer si el WebView no carga
        - qué hacer si el usuario cerró el checkout
        - dudas básicas sobre completar el formulario de pago
        - orientación general si el pago aparece pendiente o rechazado, sin confirmar el estado

        ────────────────────
        RESPUESTAS SUGERIDAS
        ────────────────────
        Si el usuario pregunta cómo pagar:
        “Abre el botón de pago y sigue las instrucciones del checkout. Cuando termines, vuelve a esta conversación.”

        Si el WebView no carga:
        “Intenta abrir el botón nuevamente y revisa tu conexión. Si el problema continúa, puedes intentar más tarde o pedir ayuda por este mismo chat.”

        Si el usuario dice que el pago fue rechazado:
        “Puedes revisar los datos ingresados e intentarlo nuevamente. Si el problema continúa, usa otro método de pago o solicita ayuda por este canal.”

        Si el usuario dice que ya pagó:
        No confirmes el pago. No respondas si el mensaje parece ser un resultado automático o comprobante. Si es solo una frase del usuario, responde:
        “Gracias. Esperemos la confirmación del pago para continuar.”

        ────────────────────
        CIERRE
        ────────────────────
        Si el usuario dice que ya no necesita ayuda, responde breve:
        “Perfecto. Si necesitas algo más, aquí estaré.”
        ```
      </Accordion>

      <Accordion title="Pago fallido" icon="circle-xmark">
        Se activa cuando la transacción fue rechazada, declinada, denegada o no se completa.

        Recomendaciones:

        * permitir reintento controlado
        * ofrecer soporte o un camino alternativo
      </Accordion>

      <Accordion title="Error" icon="triangle-exclamation">
        Se activa ante errores técnicos, errores del proveedor o fallas de comunicación durante la creación o el procesamiento del pago.

        Recomendaciones:

        * registrar el error
        * mostrar mensaje de contingencia
        * reintentar de forma controlada y escalar si persiste
      </Accordion>
    </AccordionGroup>
  </Tab>
</Tabs>

***

## Probar pagos en Sandbox

Si Wompi está conectado con credenciales **Sandbox**, puedes probar el checkout con los datos de prueba publicados por Wompi.

<Note>
  En Sandbox, el pago es ficticio y no mueve dinero real.
</Note>

<Steps>
  <Step title="Confirmar credenciales Sandbox">
    Verifica que Wompi esté instalado con credenciales que tengan prefijos `pub_test_`, `prv_test_`, `test_events_` y `test_integrity_`.
  </Step>

  <Step title="Configurar el nodo en ambiente de prueba">
    En la pestaña **Avanzado**, verifica que el ambiente corresponda a desarrollo/prueba.
  </Step>

  <Step title="Completar datos del comprador">
    Usa un email y nombre de prueba o controlado en los campos **Email comprador** y **Nombre completo comprador**.
  </Step>

  <Step title="Probar desde WhatsApp">
    Dispara el flujo desde WhatsApp, abre el checkout WebView de Wompi y selecciona un medio de pago de prueba.
  </Step>

  <Step title="Validar la salida del flujo">
    Verifica por qué salida continúa el flujo:

    * **Pago exitoso**
    * **Pago pendiente**
    * **Pago fallido**
    * **Error**
  </Step>
</Steps>

<Frame caption="Checkout de Wompi en WhatsApp usando datos de prueba Sandbox">
  <img src="https://mintcdn.com/jelouai/qfuCOV36dV96m5-d/assets/images/integraciones/pagos/wompi-webview-whatsapp-sandbox.gif?s=1560549bbb7f78559fa45f9a41807816" alt="Animación del checkout WebView de Wompi abierto desde WhatsApp para completar un pago de prueba en Sandbox" style={{ maxWidth: '280px', margin: '0 auto' }} width="320" height="693" data-path="assets/images/integraciones/pagos/wompi-webview-whatsapp-sandbox.gif" />
</Frame>

***

## Datos de prueba en Sandbox

<Note>
  Los datos de prueba aplican solo cuando la integración está instalada con credenciales Sandbox y el nodo se ejecuta en ambiente de prueba.
</Note>

<AccordionGroup>
  <Accordion title="Tarjetas">
    Para probar pagos con tarjeta en Sandbox:

    * **Aprobada:** `4242 4242 4242 4242`
    * **Declinada:** `4111 1111 1111 1111`

    Usa cualquier fecha de expiración futura y un CVC de 3 dígitos.

    Si usas otra tarjeta, el estado final puede ser `ERROR`.
  </Accordion>

  <Accordion title="Nequi">
    Para probar pagos con Nequi:

    * **Aprobada:** `3991111111`
    * **Declinada:** `3992222222`

    Cualquier otro número puede generar una transacción con estado `ERROR`.
  </Accordion>

  <Accordion title="PSE">
    En el checkout de Wompi, usa los bancos de prueba disponibles:

    * **Banco que aprueba:** genera una transacción aprobada.
    * **Banco que rechaza:** genera una transacción declinada.
  </Accordion>

  <Accordion title="Otros medios de pago">
    Wompi también publica datos de prueba para medios como Botón Bancolombia, Bancolombia QR, Puntos Colombia, DaviPlata, BNPL Bancolombia y otros métodos disponibles según la cuenta.

    Consulta la [documentación oficial de Wompi sobre datos de prueba en Sandbox](https://docs.wompi.co/docs/colombia/datos-de-prueba-en-sandbox/) para revisar el detalle actualizado.
  </Accordion>
</AccordionGroup>

***

## Pasar a producción

Si instalaste Wompi con credenciales de **desarrollo/Sandbox**, puedes iniciar el paso a producción desde la pestaña **Avanzado** del nodo Wompi en **Canvas** o desde la página de **Wompi** en **Marketplace**.

En ambos casos se abre el mismo modal para ingresar credenciales productivas y confirmar la configuración correspondiente.

Antes de operar con pagos reales:

* Asegúrate de tener credenciales de **Producción** completas: llave pública, llave privada, secreto de eventos y secreto de integridad. También confirma que la **URL de Eventos** esté correctamente configurada en Wompi.
* Usa el flujo **Pasar a producción** descrito en [Conectar en Brain Studio](/guides/integraciones/pagos/proveedores/wompi/conectar-en-brain-studio).
* Reemplaza en el nodo cualquier dato de prueba por datos reales del flujo.
* En producción, usa el email y nombre real del comprador.
* Ejecuta una prueba real de bajo monto antes de escalar.

***

## Consideraciones importantes

<AccordionGroup>
  <Accordion title="El ambiente depende de la instalación">
    Si instalaste Wompi con credenciales Sandbox, prueba con datos de prueba. Si instalaste con credenciales de Producción, usa datos reales.
  </Accordion>

  <Accordion title="La URL de Eventos debe estar configurada">
    El estado final del pago depende de los eventos que Wompi envía a Jelou. Si la URL de Eventos no está configurada en el ambiente correcto, el flujo puede no avanzar por la salida esperada.
  </Accordion>

  <Accordion title="Evita pagos duplicados">
    En escenarios pendientes o fallidos, informa con claridad antes de iniciar otro intento de cobro. Mantén reintentos controlados.
  </Accordion>

  <Accordion title="Los datos de Sandbox no sirven en Producción">
    Tarjetas, teléfonos y bancos de prueba solo aplican en Sandbox. En producción el usuario debe usar datos reales.
  </Accordion>
</AccordionGroup>

***

## Próximo paso

<Card title="Cobertura y precios" href="/guides/integraciones/pagos/proveedores/wompi/cobertura-y-precios" icon="globe">
  Revisa disponibilidad, moneda, medios de pago y consideraciones comerciales de Wompi.
</Card>
