Skip to main content

Guía de integración para VirtueMart

Si tienes una página e-commerce desarrollada en Joomla + VirtueMart, puedes integrar Flow mediante las extensiones y comenzar a operar con pagos online.

¿No eres parte de Flow? Antes de continuar, debes registrarte en Flow y seleccionar la opción Quiero recibir pagos a través de Flow. Si aún no tienes una cuenta regístrate aquí.

Modelo de integración

Toda la comunicación entre el comercio y Flow viaja firmada electrónicamente con certificados digitales. Las firmas digitales son verificadas en cada punto de comunicación, asegurando la confiabilidad entre el emisor y el receptor. A continuación te explicamos los dos modelos de integración con Flow el indirecto y directo.

Modo indirecto

Con este modo de integración, antes de enviar la transacción a Webpay, Servipag o Multicaja, se presenta una página de Flow con los datos de la transacción. Además, en dicha página se muestran los medios de pago habilitados por el vendedor, permitiendo al pagador elegir el deseado.

virtue14b5ce660751d9773f02857c5ee22841e.png

Descripción de acciones
1El comercio, utilizando el Kit, envía a Flow una Orden de Pago firmada electrónicamente.
2Flow recibe la Orden y verifica que provenga de un comercio registrado. En este paso presenta una página para que el pagador confirme la orden y seleccione el medio de pago deseado: Webpay, Servipag o Multicaja.
3Flow deriva al pagador a la página del medio de pago (Webpay, Servipag o Multicaja) seleccionado.
4El medio de pago envía a Flow el resultado de la transacción y solicita confirmarla.
5Flow envía el resultado del pago a la página de confirmación del comercio.
6El comercio recibe la confirmación del pago. La página del comercio tiene 15 segundos para responder la recepción de la confirmación. Si su página de confirmación no responde en ese tiempo y la transacción había sido aprobada por el medio de pago, la transacción se dará por aprobada.
7Flow envía al medio de pago la confirmación de la transacción.
8Si el pago es exitoso, Flow deriva el control a la página de éxito del comercio. Además, se envía un email notificado del pago al vendedor y al pagador.
9Si el pago es rechazado, Flow despliega su página de fracaso.
10Desde la página de fracaso de Flow, si el cliente hace click en el botón (Volver al comercio) se invoca la página de fracaso del comercio.

Modo directo

Con este modo de integración Flow envía la transacción directo a Webpay, Servipag o Multicaja según corresponda, sin presentar una página de Flow con los datos de la transacción.

virtue14b5ce660751d9773f02857c5ee22841e.png

Descripción de acciones
1El comercio, utilizando el Kit, envía a Flow una Orden de Pago firmada electrónicamente.
2Flow deriva al pagador a la página del medio de pago (Webpay, Servipag o Multicaja) informado desde el Kit.
3El medio de pago envía a Flow el resultado de la transacción y solicita confirmarla.
4Flow envía el resultado del pago a la página de confirmación del comercio.
5El comercio recibe la confirmación del pago. La página del comercio tiene 15 segundos para responder la recepción de la confirmación. Si su página de confirmación no responde en ese tiempo y la transacción había sido aprobada por el medio de pago, la transacción se dará por aprobada.
6Flow envía al medio de pago la confirmación de la transacción.
7Si el pago es exitoso Flow deriva el control a la página de éxito del comercio. Además, se envía un email notificado del pago al vendedor y al pagador.
8Si el pago es rechazado Flow despliega su página de fracaso.
9Desde la página de fracaso de Flow si el cliente hace clic en el botón (Volver al comercio) se invoca la página de fracaso del comercio.

Requisitos

Para integrar a Flow tu sitio de E-commerce basado en WooCommerce necesitas:

  • Estar registrado en Flow como vendedor
  • Descargar el Certificado digital desde Mis Datos
  • Tener instalado VirtueMart 2 o 3
  • Asegurarse que su tienda está visible desde internet

Descargar e instalar

Descargar Extensión Flow para Webpay VirtueMart 2

Descargar Extensión Flow para Servipag VirtueMart 2

Extensión Flow para MultiCaja VirtueMart 2: Pronto

Descargar Extensión Flow para Webpay VirtueMart 3

Descargar Flow para Servipag VirtueMart 3

Descargar Flow para MultiCaja VirtueMart 3

Una vez que hayas descargado las extensiones deseadas debes acceder al panel de administración de Joomla, dirigirte al menú Extensiones e ingresar al Gestor de extensiones.

virtue3.9ce316e63c4fcb1c9b8d45abee791f084.png

En la pestaña Instalar debes cargar cada extensión descargada y presionar el botón Subir e instalar.

virtue4b19de7e1049a6d4c5794778c77f6b06d.png

Si la instalación fue exitosa, al dirigirte a la pestaña Gestionar y buscar Flow deberías ver la siguiente pantalla.

virtue5fe771e101fd532fadcf9478339f74f8d.png

Actualizar extensión de Flow

Si ya posees alguna versión de Flow instalada en tu VirtueMart y deseas actualizarla, tienes que desinstalar la versión anterior:

  • Dirígete al panel de administración de Joomla, menú Extensiones
  • Ingresa al Gestor de extensiones y haz clic en la pestaña Gestionar
  • Busca y selecciona la extensión de Flow que quieres desinstalar
  • Presiona el botón superior derecho Desinstalar

Una vez que hayas desinstalado la versión anterior, sigue las mismas instrucciones del paso Descargar e Instalar. Luego, configura la extensión como se muestra en el paso Configurar la extensión de Flow.

Configuración de la extensión VirtueMart de Flow

Para configurar una determinado extensión de Flow es necesario dirigirse al menú VirtueMart > Tienda > Métodos de pago > Clic en el ícono Nuevo, que encuentra en la esquina superior derecha.

virtue68f71cde206ee90368977fa3a12777904.png

Si no has agregado ningún método de pago, sigue las siguientes instrucciones:

virtue71da6d6d473adc352bef34bf9e1e52d04.png

Los datos que debes configurar en la ventana Información método de pago son:

CampoDescripción
Nombre de método de pagoIngresa el nombre que se mostrará a las personas cuando paguen en tu tienda virtual, por ejemplo:
  • Flow: Pagar mediante Flow a través de Webpay, Servipag, Multicaja, Onepay y más.
  • Descripción del medio de pagoIngresa la descripción que se mostrará a las personas cuando paguen en tu tienda virtual, por ejemplo:
  • Flow Webpay: Pagar con tarjetas de crédito o débito bancarias
  • Flow Servipag: Pagar con tarjetas CMR, Ripley o Cencosud
  • Flow Multicaja: Pagar en efectivo en locales adheridos a Multicaja
  • Flow: Pagar mediante plataforma de pagos Flow con Webpay, Servipag y Multicaja.
  • Método de pagoSelecciona Flow Webpay, Flow Servipag o Flow Multicaja según corresponda.
    PublicadoSe recomienda seleccionar No mientras la configuración no esté realizada en forma total.
    MonedaSelecciona peso chileno
    Click en "Guardar los cambios"Debes hacer clic en Guardar los cambios para confirmar tu configuración.

    En la pestaña Configuración completa la siguiente información:

    virtue977b7ad04a60154f980644bfe04186a2f.png

    Los datos que debes configurar en la ventana configuración son:

    CampoDescripción
    Plataforma flowSelecciona si utilizarás la plataforma de producción o la plataforma sandbox de Flow:
  • Plataforma de producción Flow: Se encuentra disponible en flow.cl y corresponde al sitio oficial, el cual debes utilizar para recibir tus pagos.
  • Plataforma sandbox Flow: Se encuentra disponible en sandbox.flow.cl y corresponde al sitio de pruebas, donde podrás realizar pagos de test para verificar el correcto funcionamiento del plugin.
  • Id Comercio FlowIngresa el email con el que estas registrado en flow
    Url de retornoCorresponde a la página donde volverá el cliente una vez que generó un cupón de pago. Recomendamos que dicha url sea la página principal de tu tienda.
    Modo de accesoAquí debes seleccionar el tipo de integración deseado.
  • Ingresar directamente: Corresponde al modo directo de integración. Una vez que el cliente confirme el pago en el sitio web del comercio, se abrirá inmediatamente la pantalla de pagos de Webpay, Servipag o Multicaja, según corresponda.
  • Mostrar pasarela Flow: Corresponde al modo indirecto de integración. Previo al pago en Webpay, Servipag o Multicaja, se mostrará una ventana de Flow donde se indican los datos de la transacción (comercio, concepto, monto, email del pagador, etc). También se mostrarán al pagador los medios de pago que tenga habilitados el vendedor (Webpay, Servipag y/o Multicaja), pudiendo elegir el que desee.
  • Llave Privada FlowPara obtener la llave privada se debe descargar el certificado digital desde mis datos, el cual corresponde a un archivo llamado comercio.pem. El archivo debes abrirlo con un editor de texto y copiar la totalidad de su contenido. Es importante verificar que el archivo se copió completamente.
    PaísChile
    MonedaCLP Chile pesos
    Monto mínimo y monto máximoSi el producto tiene un pago fuera de estos valores, no se ofrecerá flow como método de pago
    Estado pendienteSeleccionar Pendiente
    Estado exitosoSeleccionar Confirmado
    Estado fallidoSeleccionar Cancelado
    Click en "Guardar los cambios"Debes hacer clic en Guardar los cambios para confirmar tu configuración.

    Debes hacer clic en el símbolo rojo Published. Si todo se ha realizado en forma correcta, dicho botón deberá cambiar a color verde.

    virute1176331fff119ecd0e8163a19ab3b48f1c.png

    Validar configuración seleccionada

    Antes de comenzar a operar mediante Flow, te recomendamos validar la siguiente configuración:

    • Si estás utilizando el sitio de pruebas sandbox:
    1. Plataforma de Flow: Debes seleccionar la opción "Plataforma de pruebas de Flow"
    2. ID Comercio Flow: Debes ingresar el email de la cuenta con que estás registrado en sandbox
    3. Llave privada Flow: Debes subir el último certificado digital descargado desde aquí
    • Si estás utilizando el sitio de producción flow.cl:
    1. Plataforma de Flow: Debes seleccionar la opción "Plataforma oficial de Flow"
    2. ID Comercio Flow: Debes ingresar el email de la cuenta con que estás registrado en flow.cl
    3. Llave privada Flow: Debes utilizar el último certificado digital descargado desde flow.cl

    Si estás utilizando el sitio de pruebas sandbox, puedes simular un pago mediante Webpay con las siguientes tarjetas:

    Pago exitoso

    Nº de tarjetas: 4051885600446623

    Fecha de expiración: cualquiera

    CVV: 123

    En la simulación del banco debes usar:

    RUT: 11.111.111-1

    Clave: 123

    Pago rechazado

    Nº de tarjetas: 5186059559590568

    Fecha de expiración: cualquiera

    CVV: 123

    En la simulación del banco debes usar:

    RUT: 11.111.111-1

    Clave: 123

    ¿Es posible tener sólo una extensión instalada y recibir pagos mediante Webpay, Servipag y Multicaja?

    Si es posible, para ello debes seguir las siguientes instrucciones:

    • Verificar en la sección Medios de pago que tienes los medios de pago activados.
    • Instalar una extensión, puede ser la extensión Flow Webpay, Flow Servipag o Flow Multicaja.
    • Configurar la extensión como se describe en los puntos anteriores.
    • En el modo de acceso, debes seleccionar la opción Mostrar pasarela Flow.
    • En el nombre del medio de pago recomendamos poner un nombre genérico, por ejemplo "Pagar mediante plataforma de pagos Flow con Webpay, Servipag y Multicaja".

    Opciones avanzadas

    A continuación se muestran opciones adicionales para personalizar la configuración de la extensión. Estas opciones requieren cierto nivel de conocimiento sobre HTML y programación.

    Agregar imagen al medio de pago

    Debes seguir las siguientes instrucciones para mostrar una determinada imagen cuando el cliente elija el medio por el cual pagará.

    1. En primer lugar debes ingresar a la configuración de la extensión de Flow:
    • Tienda -> Métodos de pago -> Flow Webpay -> Información del método de pago, para Flow Webpay
    • Tienda -> Métodos de pago -> Flow Servipag -> Información del método de pago, para Flow Servipag
    • Tienda -> Métodos de pago -> Flow Multicaja -> Información del método de pago, para Flow Multicaja
    1. En la opción Nombre de método de pago puedes ingresar la imagen que desees como código HTML, por ejemplo:
    <!-- Pagar con tarjetas de crédito o débito bancarias -->
    <img src='http://www.flow.cl/img/logo_webpay.png' width='80px'>
    <!-- Pagar con tarjetas CMR, Ripley o Cencosud -->
    <img src='http://www.flow.cl/img/BP_Servipag_peq.png' width='80px'>
    <!-- Pagar en efectivo en locales adheridos a Multicaja -->
    <img src='http://www.flow.cl/img/logo_multicaja_150_55.png' width='80px'>
    1. Finalmente se deben guardar los cambios y revisar que la imagen se muestre correctamente.