Ticker

6/recent/ticker-posts

Ad Code

Responsive Advertisement

Cobrar usando Bizum y RedSys desde formularios de Contact Form 7 ¿qué clase de magia es esta?

¿Qué puede pasar si integras el plugin de formularios para WordPress más instalado, la plataforma de pagos por defecto de los bancos en España, RedSys, y el método de pago Bizum para pequeños pagos inmediatos?

Supongo que esta es la idea que se le ocurrió a la empresa cordobesa Codection cuando decidieron desarrollar un plugin que integre la pasarela de pagos RedSys + Bizum con Contact Form 7.

¿Es la pasarela de pagos de RedSys + Bizum para Conctact Form 7 un sustituto de WooCommerce?

Aunque no se puede decir que este plugin sea un sustituto «natural» de WooCommerce, en realidad es una solución buenísima para multitud de necesidades de cobro de importes de manera puntual, como por ejemplo:

  • Recibir cualquier tipo de donativos.
  • Pagos de micromecenazgos (crowdfunding)
  • Cobros puntuales de facturas de clientes con un simple formulario.
  • Pago de servicios puntuales mediante formulario.
  • Cobro sencillo de cuotas de clubes y asociaciones.
  • Alternativa rápida a la domiciliación de pago de cuotas diversas.
  • Cobro de productos o servicios personalizados, no susceptibles de existir a modo de catálogo.
  • Y miles de posibles situaciones más…

Si necesitas recibir pagos de cualquier cantidad, sin tener que instalar plugins monstruosos de comercio electrónico como WooCommerce o Easy Digital Downloads, con este plugin de pagos con RedSys y Bizum en formularios de Contact Form 7 tienes todo lo necesario, de manera sencilla y sin sobrecargar de código y tablas tu web.

¿Qué es RedSys?

logo redsys

RedSys es la pasarela de pago online mediante tarjetas de crédito y débito utilizada por la inmensa mayoría de las entidades bancarias españolas. Funciona como pasarela intermedia entre tu tienda online y tu banco, y no tiene ningún coste directo asociado, pues el precio por las transacciones lo negocias con tu banco, siendo en todos los casos mucho más bajas las comisiones que en otras plataformas como Stripe y, no digamos PayPal.

Otra ventaja de RedSys es que la transacción se realiza al instante, pudiendo disponer de los fondos en tu cuenta bancaria nada más realizar la venta, sin esperas de ningún tipo, porque estás cobrando directamente desde tu banco, mediante la pasarela RedSys.

¿Qué es Bizum?

logo bizum

Bizum es un sistema de pagos rápidos y sencillos existente en España, con el que puedes enviar dinero únicamente indicando el número de teléfono móvil del destinatario. Para poder hacer envíos o pagos mediante Bizum tienes que activarlo en tu entidad bancaria.

Para hacer un pago o envío puedes realizarlo desde la app móvil oficial de Bizum o desde la app de tu banco.

Es un método de pago cada vez más popular, no solo para envíos de dinero puntuales entre amigos y familiares, sino también últimamente como sistema de pago rápido en todo tipo de tiendas online.

El único inconveniente es que tiene un límite de importe, actualmente de 2.000 euros.

¿Qué es Contact Form 7?

contact form 7

Es un plugin, el más instalado, activado y utilizado por los usuarios de WordPress en el mundo. Es sencillo, ligero y funciona. Tiene todo lo que necesitas para hacer todo tipo de formularios, y si detectas que le falta algo hay montones de plugins adicionales que le agregan funcionalidades extra. Si quieres aprender más sobre este maravilloso plugin aquí tienes unos cuantos tutoriales sobre Contact Form 7.

¿Para qué sirve el plugin de RedSys + Bizum para Contact Form 7?

redsys cf7

Esta joya hace sencillo algo que es complicado sin él, y dicho en breve lo que consigue es que permite convertir cualquier formulario de Contact Form 7 en una forma de pago, da igual los campos que tenga el formulario, tras el envío del formulario, en vez de simplemente mostrar el típico mensaje de que el formulario se ha enviado, se redirige al usuario a la plataforma de pago activada: RedSys, Bizum o Transferencia bancaria, automáticamente.

¿Qué necesito para poder usar formularios de Contact Form 7 para recibir pagos o donaciones?

La lista es sencilla, y corta:

  1. Activar la pasarela de pagos RedSys en tu entidad bancaria, y si quieres también Bizum.
  2. Cualquier formulario creado con el plugin Contact Form 7.
  3. El plugin de RedSys para Contact Form 7.

¿De verdad es así de simple?, ¿funciona con cualquier formulario?

Pues sí, fin de la historia. Bueno, hay cosas que configurar, lógicamente, pero es poca cosa.

Cómo recibir pagos con RedSys desde formularios de Contact Form 7?

Vamos a ver de manera sencilla y rápida como puedes empezar a utilizar tus formularios creados con Contact Form 7 para recibir pagos mediante la pasarela de pagos RedSys y Bizum.

Activando RedSys y Bizum

Asumiendo que ya has activado la pasarela de pagos en tu banco, que normalmente suelen llamar TPV virtual, recibirás un correo con los datos de conexión con la pasarela RedSys, inicialmente con unos datos de pruebas. Los importantes son estos:

  • FUC: Suele ser un número con varias cifras.
  • Terminal: Es el número del TPV virtual, casi siempre, cuando solo tienes uno, el número 1.
  • Clave de encriptación segura, también llamada clave SHA-256: Es una clave alfanumérica, para que las transacciones sean seguras.
  • Entorno: Aquí hay dos tipos de entorno, a saber…
    1. Sis-t: Este es el llamado entorno de pruebas, el primero que debes usar y probar.
    2. Sis, Sis-d o Sis-i: Es el entorno de uso real, en la documentación que recibes te dirá cuál debes elegir.

Esta información debes apuntarla, pues debes introducirlos en los ajustes del plugin (de este y de cualquier otro plugin para RedSys), primero activarás la pasarela de pagos con el entorno de pruebas, y cuando hayas terminado debes informar por email o teléfono a RedSys, y te llegarán los datos del entorno real, de producción.

También te darán la URL del escritorio de transacciones de RedSys y además una serie de números de tarjetas para hacer pruebas, y que así compruebes qué pasa al hacer los pagos, cómo se ven en el tablero, y otras comprobaciones que quieras realizar.

Es más sencillo de lo que parece, y además no vas a estar solo, porque por un lado el equipo de soporte de RedSys son tremendamente amables, incluso comprensivos, y te suelen atender de maravilla, especialmente por teléfono, y por el otro tienes al soporte del equipo de Codection, desarrolladores del plugin de pagos con RedSys y Contact Form 7, gente majísima, de ahí mismo, de Córdoba, que te atienden en tu idioma, y son también extremadamente amables.

Es una situación extraña recibir tanto y buen soporte, algo en lo que deberían mejorar otras plataformas de pago y autores de plugins, como por ejemplo pasa con PayPal, donde te ves totalmente solo ante cualquier duda o dificultad, o tardan mucho, o te dan explicaciones tan técnicas que te quedas como estabas. Afortunadamente con RedSys y Codection esto no pasa.

Adicionalmente, normalmente desde la app móvil de tu banco, puedes activar la pasarela Bizum, para enviar o recibir pagos con el teléfono móvil, desde formularios, una tienda online o directamente desde la app de Bizum. Te lo recomiendo, es muy fácil y cada vez lo usa más gente, especialmente los más jóvenes, pero no solo ellos, también lo están adoptando mucho la gente más mayor, precisamente por su facilidad.

Instalando los plugins

No te voy a recordar cómo instalar plugins en WordPress (aquí lo explico en detalle)

Debes instalar y activar el plugin gratuito Contact Form 7, si aún no lo tenías, y a continuación la madre del cordero, el remedio de la madre Celestina, el linimento milagroso que consigue integrar tus formularios con RedSys y Bizum: Pasarela de pago para RedSys y Bizum con Contact Form 7, que tiene un coste anual de 49,95€ si compras una sola licencia, pero que te puede costar la mitad si compras varias.

Una vez instalado y activo debes también activar la licencia, introduciendo el código que encontrarás en tu cuenta de Codection.

licencia redsys cf7

Hecho esto, vamos a conectar RedSys…

Configurar la pasarela de pagos RedSys + Bizum

El plugin tiene sus ajustes como submenús del menú de Contact Form 7 (Contacto), en concreto en:

  • Contacto → Opciones de RedSys
  • Contacto → Opciones de Bizum
  • Contacto → Opciones de domiciliación bancaria
ajustes redsys cf7 ajustes bizum cf7 ajustes transferencia cf7

Ve a las opciones de RedSys e introduce los datos de la conexión con la pasarela que comentamos antes (recuerda, el FUC, terminal, clave), y otros ajustes opcionales, como el idioma, la URL de las paginas de pago correcto o incorrecto, incluso si quieres aplicar algún tipo de recargo.

Una opción muy interesante, si usas el servicio, es la integración con el servicio de newsletters SendinBlue, pues puedes introducir aquí mismo la clave API de tu cuenta en SendinBlue y añadir los clientes que te hagan pagos a una lista de correo. Muy chulo, y que espero que amplíen con más servicios, como por ejemplo MailerLite, que es el que uso yo.

Lo mejor de todo es que no tienes que configurar 3 veces todo, en cuando introduzcas los datos de conexión con RedSys, se copia la información necesaria al resto de página de opciones.

Ejemplos pago mediante RedSys con formularios de Contact Form 7

Lo sé, todo lo anterior es morralla, imprescindible, pero lo que quieres es saber cómo se hace para recibir pagos al instante desde algo tan básico como un formulario de contacto. Vamos a ver algún ejemplo, pero que sepas que hay montones de posibilidades, según cómo plantees el formulario.

La forma de recibir pagos con un formulario más sencilla que se me ocurre es usar el que viene por defecto en Contact Form 7 ¿verdad?, pues vamos a ver si es verdad.

El formulario viene con estas etiquetas por defecto:

<label> Tu nombre
[text* your-name autocomplete:name] </label>

<label> Tu correo electrónico
[email* your-email autocomplete:email] </label>

<label> Asunto
[text* your-subject] </label>

<label> Tu mensaje (opcional)
[textarea your-message] </label>

[submit "Enviar"]

Y se verá en la pantalla tal que así…

formulario cf7 y redsys

¿Notas algo diferente o nuevo? ¿en serio? ¿no ves las flechas que apuntan a una pestaña que no viene en Contact Form 7 por defecto?, sí, esas que pone RedSys.

Hasta este momento, si añades este formulario a cualquier página o entrada, aunque tengas ya instalado y configurado el plugin de RedSys y Bizum para Contact Form 7 no pasará nada, se enviará normalmente, como está configurado.

La cosa funcionará de otro modo si te pasas por esa pestaña de RedSys y activamos un par de ajustes. Por ejemplo:

activar redsys con precio fijo en cf7

Un repaso rápido, ya que es la primera vez que los vemos, a todos los posibles campos:

  • Activar RedSys en este formulario – Por defecto está en «No», pero si quieres que el formulario funcione para pagos tienes que cambiarlo a «Sí» o «En base a un valor». En el ejemplo simplemente lo hemos activado, en «Sí»
  • Descripción del pago que se enviará a la pasarela – Es un texto (opcional) que puedes adjuntar para que se registre con el pago, para por ejemplo distinguir unos pagos de otros.
  • Precio – La madre del cordero es esta cajita, y puedes hacer varias cosas, como poner una etiqueta, o como en este caso una cantidad, en el ejemplo «20» que será el importe que se cobrará a quién envíe el formulario.
  • Campo nombre – Este campo (opcional) es por si quieres poner aquí la etiqueta del formulario que se usa para el nombre, para que se registre el dato en el pago.
  • Campo email – Lo mismo (opcional) para el correo electrónico.
  • Perfil – Este campo (opcional) es por si quieres utilizar etiquetas condicionales, en las que usar alguno de los distintos perfiles definidos en los ajustes del plugin de la pasarela, o para indicar si el pago se hará con RedSys, Bizum o qué. En este ejemplo no lo usaremos.
  • URLs OK y KO propias – Si quieres usar las páginas de confirmación definidas en los ajustes (lo vimos antes) o no.
  • Enviar email a cliente si el pago es correcto – Si quieres enviar un email adicional al cliente, como confirmación del pago.

Aunque parece poca cosa, y lo es, en realidad son campos que permiten muchísimas posibilidades, algunas recogidas en la documentación del plugin, y otras que se te ocurran seguramente puedan asesorarte el equipo de soporte, como fue mi caso para un formulario un poco especialito. Para empezar a conocerlos nada mejor que usar los datos de prueba de RedSys y crear formularios avanzados de todo tipo aprovechando los textos informativos al lado de cada ajuste, realmente útiles.

Dicho esto, el formulario se verá como cualquier otro…

formulario cf7 normal con redsys

No se diferencia en nada a simple vista de cualquier otro formulario.

Pues bien, en este ejemplo solo hemos activado RedSys en el formulario, y definido un pago fijo ¿qué pasará si alguien envía ese formulario?

pago redsys cf7

Pues que, en vez de ver simplemente el mensaje de formulario enviado típico de Contact Form 7, se le redireccionará automáticamente a la página de pago de RedSys del banco asociado, ya con el importe definido en los ajustes de RedSys para este formulario, que te recuerdo era de 20 euros, como puedes ver en la captura anterior.

¿A que era fácil? … incluso ¡¡¡asusta!!!

Nota aclaratoria: Te doy un consejo, y es que no seas rácano con el formulario, porque si lo dejamos como está por defecto el usuario se asustará, porque nada en el formulario le avisa de que no sirve para contactar, sino para pagar 20 euros. Así que, por ejemplo, cambia el texto del botón por algo como «Pagar», «Hacer donación» o lo que sepa, y avisa con algún texto para qué sirve ese formulario.

Este ejemplo era sencillo, pero deja algo claro: Da igual lo que haya en tu formulario, en realidad el plugin de RedSys y Bizum para Contact Form 7 dispara la pasarela de pagos con el botón de envío de Contact Form 7, algo tan simple pero tan efectivo.

Veamos otro ejemplo…

Digamos que, partiendo del mismo formulario anterior, no queremos asignar un pago fijo, sino que preferimos dejar el importe a voluntad del usuario. En este caso solo tenemos que hacer un cambio:

precio redsys con tag de cf7

Si te fijas, en vez de poner una cantidad fija, he definido que será una etiqueta (de Contact Form 7) la que actuará para definir el precio. El resto está como antes.

Luego, en el formulario en sí, hay que hacer algún cambio, mira:

etiquetas cf7 para redsys

Además de borrar lo del asunto y el mensaje, que sobran para un formulario de pago, y cambiar el texto del botón de envío a «DONAR», más intuitivo, he añadido un campo, en este ejemplo de texto, con el identificador que antes definí en los ajustes de RedSys para el formulario: donativo.

¿Qué pasará con el formulario una vez guarde los cambios?

formulario donacion voluntaria cf7 redsys

Cuando el usuario introduzca un importe personalizado, de digamos 100 euros, eso será lo que «viajará» a RedSys para que haga el pago.

pago personalizado redsys desde cf7

Fácil ¿eh?

No me quiero extender mucho, porque básicamente funciona con cualquier campo de Contact Form 7, pero veremos un ejemplo más, en este caso, con un botones de selección (radio) en el el usuario podrá elegir entre una lista de posibles importes.

El formulario sería así:

<label> Tu nombre
[text* your-name autocomplete:name] </label>

<label> Tu correo electrónico
[email* your-email autocomplete:email] </label>

<label> Haz tu donación (elige el importe que quieras donar)
[radio donativo clave-valor "10€|10" "20€|20" "50€|50"]
</label>
[submit "DONAR"]

Fíjate que es un campo de radio en el que, además del identificador del precio (donativo), hemos añadido la etiqueta clave-valor y a continuación una serie de importes siguiendo la sintaxis de Contact Form 7 ("valor visible|valor aplicable")

En la pestaña de RedSys del formulario no haría falta cambiar nada, porque la etiqueta de precio seguimos usando la misma (donativo).

Y el resultado sería un formulario así:

formulario donaciones varios valores cf7 redsys

Que si el usuario elige hacer la donación de 10€ en RedSys lo recogería correctamentepago redsys varios valores cf7

Para finalizar, vamos a usar también la opción de activar RedSys en base a un valor, que puede ser positivo, negativo, o como en el siguiente ejemplo, permitiendo elegir entre tarjeta o Bizum.

Primero configuramos la pestaña de RedSys, cambiando la activación de «Sí» a «En base a un valor», y definiendo cómo se llamará la etiqueta que usaremos, en este ejemplo [tarjeta-bizum]. El resto lo dejamos igual que antes.

cf7 redsys en base a un valor

A continuación, como antes, debemos usar esa nueva etiqueta ([tarjeta-bizum]) en algún campo del formulario, así por ejemplo, con un campo de menú desplegable (select)…

<label> Tu nombre
[text* your-name autocomplete:name] </label>

<label> Tu correo electrónico
[email* your-email autocomplete:email] </label>

<label> Haz tu donación (elige el importe que quieras donar)
[radio donativo clave-valor "10€|10" "20€|20" "50€|50"]
</label>

<label> Elige el método de donación
[select tarjeta-bizum clave-valor "Tarjeta de crédito|Primero" "Bizum|Bizum"]
</label>
[submit "DONAR"]

¿Por qué en el valor aplicable de la tarjeta de crédito ponemos Primero? Pues porque, por defecto, en los ajustes de RedSys, salvo que crees otros perfiles, el por defecto es ese, el primero. Aparte de esto lo demás del formulario no ha cambiado.

El resultado visible el siguiente:

formulario complejo cf7 redsys

Y, si el usuario elige Bizum desde su teléfono móvil, vería esta pantalla:

pagar bizum desde formulario contacto

Hay montones de posibilidades, y la combinación de los valores de pago y las etiquetas de campos de Contact Form 7 te dan una flexibilidad enorme para crear formularios de pago todo lo sencillos o complejos que quieras.

¿Dónde veo los pagos recibidos?

Pues en tu cuenta bancaria ¿lo dudabas?

Pero, además, también en el panel de RedSys, como siempre con esta pasarela de pagos, pero además …

El plugin del que estamos hablando también crea un registro por cada formulario/pago enviado, a modo de tipo de contenido, en un nuevo menú llamado Pagos – RedSys CF7.

pagos redsys cf7

Puedes incluso editar la información de cada pago, como si fuese una página, con tu editor de WordPress, o aprovechar para reenviar desde ahí el correo electrónico al usuario.

datos pago redsys cf7

Resumiendo y recapacitando … que es gerundio

Me ha encantado conocer este plugin de RedSys y Bizum para Contact Form 7, me parece una solución buenísima para todas esas situaciones en las que necesitas añadir un sistema de pagos en tu web y no quieres (ni debes) instalar monstruos como WooCommerce o Easy Digital Downloads, pues solo necesitas poder recibir pagos desde un formulario, con unos pocos datos del usuario.

Incluso es un sustituto más que suficiente de plugins especializados en gestión y cobro de donaciones como GiveWP, que al final es un clon de WooCommerce para formularios de donación, y con este sencillo plugin tienes todo lo necesario. Si, además, sabes que también tienen plugins como este para otros formularios, como WPForms o Gravity Forms, pues estás cubierto da igual qué uses.

El artículo Cobrar usando Bizum y RedSys desde formularios de Contact Form 7 ¿qué clase de magia es esta? lo publicó Fernando Tellado previamente en Ayuda WordPress. Lo que ves aquí es una copia de dicho contenido :/

Enregistrer un commentaire

0 Commentaires