Cómo configurar pagos con Stripe en formularios de Joomla y WordPress usando ChronoForms8

Guía Paso a Paso: Cómo Configurar Pagos con Stripe en ChronoForms 8

Overview

Esta guía proporciona un proceso claro de seis pasos para integrar pagos con Stripe en tu formulario de ChronoForms 8 para Joomla o WordPress. Cubre la instalación del plugin, agregar y configurar la acción de Stripe, generar y almacenar un ID de pedido único, y configurar el Listener de Stripe para manejar los webhooks de pago. El tutorial también incluye instrucciones para actualizar tu base de datos y probar el listener para asegurar un sistema de pago completamente funcional.

La acción de pago con Stripe es muy fácil de configurar, aquí te mostramos cómo hacerlo:

Paso 1: Instalar ChronoForms8

Asegúrate de tener la última versión de ChronoForms 8 para Joomla o WordPress instalada en tu sitio web, las últimas actualizaciones se pueden encontrar en la página oficial de Descargas

Paso 2: Agregar la acción de Stripe a tu formulario

Estamos redirigiendo a Stripe después del envío del formulario, por lo que hemos colocado la acción de Stripe en el evento Enviar de la primera página del formulario:

Cómo configurar pagos con Stripe en formularios de Joomla y WordPress usando ChronoForms8 image 2

Paso 3: Configurar la acción de Stripe

A continuación, necesitamos configurar la acción de Stripe. Así es como debería configurarse nuestra acción de Stripe:

Cómo configurar pagos con Stripe en formularios de Joomla y WordPress usando ChronoForms8 image 3

  1. La Clave secreta se puede encontrar en la configuración de tu cuenta de Stripe en la sección Desarrolladores > Claves APIhttps://dashboard.stripe.com/apikeys
  2. La Clave publicable se puede encontrar en la misma página de tu cuenta de Stripe junto con tu Clave secreta
  3. La URL de éxito es donde tu cliente será redirigido después de completar la compra exitosamente, puede ser cualquier URL en tu sitio web
  4. La URL de cancelación es donde tu cliente será redirigido si cancela la compra, puede ser cualquier URL en tu sitio web
  5. El Proveedor de Productos es un array multidimensional para los productos que se listarán en la página de compra en Stripe, el array debe contener subarrays con al menos las claves de nombre, descripción, precio y cantidad, aquí hay un ejemplo de cómo configuramos la acción php17 para devolver el array que necesitamos, luego usamos la variable {var:php17} para alimentar este array al proveedor de productos de stripe:
    Cómo configurar pagos con Stripe en formularios de Joomla y WordPress usando ChronoForms8 image 4
  6. La descripción del pago es una cadena para describir todo el pago y se mostrará en la página de pago de Stripe.

Paso 4: Generar, Almacenar y enviar a Stripe un ID de Pedido único

Es posible que desees generar un ID de pedido y almacenarlo en la Base de Datos ANTES de redirigir a Stripe, puedes hacer esto usando la acción Variables con el shortcode {str:uuid}:

Cómo configurar pagos con Stripe en formularios de Joomla y WordPress usando ChronoForms8 image 5

Luego podemos guardarlo usando la acción Guardar Datos como se muestra a continuación, ten en cuenta que "order_id" debe ser reemplazado por el nombre de la columna de la tabla que contiene el order_id

Cómo configurar pagos con Stripe en formularios de Joomla y WordPress usando ChronoForms8 image 6

Luego podemos pasar este valor a Stripe usando la variable ID Personalizado bajo el comportamiento Parámetros de Redirección:

Cómo configurar pagos con Stripe en formularios de Joomla y WordPress usando ChronoForms8 image 7

Paso 5: Configurar la acción Listener de Stripe para recibir notificaciones de webhook de pago de Stripe

En el mismo formulario, agrega una nueva página, cambia el Grupo de Página a "webhook" y toma nota del nombre de la página:

Cómo configurar pagos con Stripe en formularios de Joomla y WordPress usando ChronoForms8 image 8

En tu página de webhooks de Stripe, usa el enlace: https://www.domain.com/LIVE-LINK-TO-YOUR-FORM?chronopage=page20&output=ajax

Cambia "page20" por tu Alias de página

Bajo el evento Cargar de la página webhook, agrega la acción Listener de Stripe y configura las palabras secretas y elige un nombre para el ID Personalizado que enviamos a Stripe anteriormente.

Luego necesitarás habilitar el comportamiento Ejecutar Eventos, y habilitar el evento "En Éxito de Pago", y arrastrar una acción "Guardar Datos" debajo de él como se muestra en el #7

Cómo configurar pagos con Stripe en formularios de Joomla y WordPress usando ChronoForms8 image 9

Paso 6: Actualizar tu tabla de base de datos de pedidos

Luego puedes actualizar tu tabla de base de datos usando el ID de pedido que recibimos de Stripe:

Cómo configurar pagos con Stripe en formularios de Joomla y WordPress usando ChronoForms8 image 10

Usa el comportamiento Modificar Fuente de Datos para actualizar el campo de la tabla marcando el pedido como completado, aquí usamos un campo "order_complete":

Cómo configurar pagos con Stripe en formularios de Joomla y WordPress usando ChronoForms8 image 11

Probar la actividad del Listener de Stripe

En algunos casos, es posible que necesites asegurarte de que el Listener de Stripe sea accesible por la pasarela de Stripe, puedes hacer esto:

  1. Agregando una vista de Mensaje con algún contenido ENCIMA del listener y pegando el enlace del Listener en la barra de direcciones de tu navegador:
    https://www.domain.com/LIVE-LINK-TO-YOUR-FORM?chronopage=page20&output=ajax
    si puedes ver el mensaje, significa que el Listener es accesible por Stripe
  2. Para probar las llamadas de Stripe al listener, puedes reemplazar el mensaje por una acción de correo electrónico ficticia, asegúrate de que solo los campos Destinatarios, Asunto y Cuerpo estén completos, luego ejecuta la misma prueba anterior O realiza una transacción de prueba, deberías recibir el correo electrónico si todo está configurado correctamente.

You may also like:

Comments:

You need to login to be able to post a comment.