Pasarelas de pago fáciles de usar - Guía paso a paso para la integración de Stripe en WordPress

set up stripe on WordPress

¿Tienes una tienda online sin pasarela de pago? ¿Estás creando una nueva tienda y quieres aceptar pagos con Stripe? ¿Quieres añadir Stripe como método de pago a tu tienda actual?

Toda tienda online que venda productos, ya sean físicos o digitales, necesita una pasarela de pago que le ayude a aceptar pagos fácilmente.

En este artículo, le mostraremos, paso a paso, cómo configurar y aceptar pagos fácilmente en WordPress. Y en particular, configurar Stripe dentro de WordPress.

A la hora de empezar con una tienda online, además de decidir el mejores proveedores de servicios de alojamientoUna de las preguntas más importantes es cómo aceptar pagos en línea.

Aunque hay varias pasarelas de pago disponibles, como Amazon Pay, Authorize.Net, 2Checkout, Braintree (propiedad de Paypal), Skrill, las dos pasarelas de pago más utilizadas son PayPal y Stripe.

Tanto PayPal como Stripe te permiten integrar fácilmente una pasarela de pago con tu tienda WordPress y aceptar pagos.

Este artículo trata sobre cómo configurar Stripe con WordPress y un Tienda WooCommerce. También cubriremos la adición de opciones de pago a WPForms y Easy Digital Downloads.

En primer lugar, echemos un vistazo rápido a lo que es una pasarela de pago, lo que hace y las diferencias clave entre PayPal y Stripe.

¿Qué es una pasarela de pago y cómo funciona?

Una pasarela de pago es una aplicación integrada en su tienda en línea que permite realizar pagos seguros. Actúa como intermediario entre usted y su cliente. Funciona aceptando el pago de un cliente cuando compra algo y lo transfiere a tu cuenta bancaria.

Integración de una pasarela de pago en su sitio web o app es la forma más sencilla de aceptar pagos en línea. Estas pasarelas de pago le permiten aceptar pagos en línea a través de tarjetas de débito y de crédito, pero también de otros modos como la banca electrónica, los instrumentos de prepago y los monederos.

Este es un breve resumen de cómo funciona una pasarela de pago.

online shopping infographics

(Fuente: Freepix)

Paso 1: El cliente hace su pedido y pulsa en pagar.

Segundo paso: A continuación, se les dirige a través de una pasarela de pago donde seleccionan la opción de pago preferida e introducen la información pertinente.

Paso 3: La pasarela de pago dirige al cliente al banco emisor o a una página 3D Secure. 3D Secure requiere que los clientes completen un paso de verificación adicional para evitar el fraude. El cliente tendría que autorizar la transacción con el emisor de la tarjeta.

Paso 4: Una vez obtenida la autorización, el banco verifica datos como las credenciales del cliente y el saldo de la cuenta para completar la transacción.

Paso 5: La pasarela de pago envía un mensaje de vuelta al comerciante. Si la transacción falla, el comerciante envía un mensaje de "Transacción fallida" al cliente. Si la transacción se realiza correctamente, no sólo se mostrará un mensaje de éxito al cliente, sino que el comerciante también recibirá un mensaje de éxito del banco.

Paso 6: El banco liquida el importe con la pasarela de pago, que a su vez lo liquida con el comerciante. En función de la pasarela de pago, se aplicarán comisiones de transacción al importe antes de liquidarlo al comerciante. Trataremos este tema un poco más adelante en este artículo.

Toda la transacción se realiza a través de 'HTTPS'. Todas las pasarelas de pago requieren que su tienda utilizar el cifrado "SSL/HTTPS. SSL también es un requisito previo de Google para clasificar un sitio web, es decir, utilizar el "HTTPS" en su URL.

La mayoría de los proveedores de servicios de alojamiento ofrecen certificación SSL gratuita. Por ejemplo, SiteGround ofrece SSL gratuito con la opción "Let's Encrypt".

Siteground SSL setup

Si está pensando en crear su tienda en línea, nuestro artículo 'Cómo proteger su sitio web WordPress - Guía paso a pasoincluye todo lo que necesita saber.

Paypal vs Stripe: Visión general

Ahora que ya tenemos claro qué es una pasarela de pago y cómo funciona, vamos a ver los dos métodos de pago más utilizados, PayPal y Stripe.

Aunque no quisiéramos profundizar en los dos proveedores de pasarelas de pago en este artículo, nos gustaría resumirlos para ayudarle a tomar una decisión informada sobre cuál elegir.

ServicioPayPal EstándarRaya
Tasa por transacción2,9% + cuota fija2,9% + cuota fija
Gastos de establecimiento o cuotas mensualesNuloNulo
Contrato obligatorioNuloNulo
Micropagos (<$10)5,00% + tasa fija micropagos5,00% + tasa fija micropagos
Facturación periódicaNo
Tasa de devolución$20$15
ReembolsosPuede realizar reembolsos parciales o totales. El reembolso de un cargo es gratuito, pero no se devuelven las comisiones del cargo original.Puede realizar reembolsos parciales o totales. El reembolso de un cargo es gratuito, pero no se devuelven las comisiones del cargo original.
Atención al clienteCorreo electrónico, Centro de asistencia, teléfono y chatCorreo electrónico, Centro de asistencia, teléfono y chat 24/7
Facilidad de instalaciónFácilModerado
Cumplimiento de la PCI
Acceso a los fondosInmediato2 días (media)
Países disponibles200+30+

Los gastos pueden variar en función de su ubicación.

Para conocer las tarifas exactas en función de su ubicación, y para obtener una lista detallada de todas las tarifas y tasas aplicables, puede visitar el sitio web 'Tarifas de vendedor de PayPal' y el 'Precios de Stripe' páginas.

Tanto PayPal como Stripe ofrecen a los vendedores grandes prestaciones y flexibilidad. Al fin y al cabo, tienes la libertad de elegir una pasarela de pago en función de tus requisitos específicos.

Para este artículo, vamos a seguir adelante y configurar Stripe en nuestra tienda de WordPress. Sin embargo, vale la pena señalar que la configuración de Pagos con PayPal en WooCommerce es igualmente sencillo y sin complicaciones, y ofrece una experiencia de integración perfecta para su tienda en línea.

Cómo aceptar pagos en WordPress

Hay diferentes maneras de aceptar pagos en WordPress. Vamos a cubrir 4 métodos simples para configurar Stripe, a saber:

  1. Stripe con WordPress
  2. Stripe con WPForms
  3. Stripe en WooCommerce
  4. Stripe en Easy Digital Downloads (EDD)

Cómo configurar Stripe en un sitio WordPress

Si no tiene intención de crear una tienda de comercio electrónico completa y sólo quiere vender un producto a un precio fijo, esta opción es ideal para usted.

Si es autónomo, consultor, vende un libro electrónico, un producto digital o desea incluir un botón Donar ahora, Stripe es la solución ideal.

Paso 1: Instalar el plugin de Stripe

Instale y active la aplicación 'Stripe Payments WordPress Plugin - WP Simple Pay' plugin.

Install Stripe Payments WordPress Plugin

Este plugin tiene una versión gratuita y otra de pago.

WP Simple Pay' es un plugin independiente que puede conectar fácilmente Stripe con WordPress.

Algunas de las funciones de la versión gratuita del plugin incluyen la integración de Stripe Checkout con formularios de pago ilimitados, la visualización de imágenes de su marca y/o producto en las páginas de Stripe Checkout, una opción para recopilar las direcciones de facturación y envío de los clientes, y mucho más.

Para obtener una lista detallada de las funciones tanto de la versión gratuita como de la de pago, visite la página 'Características de WP Simple Pay Pro'.

Una vez que haya instalado y activado el plugin 'WP Simple Pay', observará una notificación de 'Modo de prueba' activada en la esquina superior derecha de su panel de control de WordPress.

Stripe Payments test mode

Paso 2: Configuración de una cuenta de Stripe

Pasar a Simple Pay Lite > Configuración como se muestra a continuación.

WP Simple pay lite test mode

Observará que en esta página de "Configuración", el "Modo de prueba" se ha establecido en "Activado". Cámbielo a Desactivado cuando ponga en marcha su sitio web o quiera empezar a aceptar pagos.

WP Simple Pay utiliza pestañas para mantener las cosas organizadas. Está la pestaña Configuración de Stripe, General y Confirmación de pago.

WP Simple pay lite general settings

En el General puede configurar las distintas páginas, como la "Página de pago correcto", la "Página de pago fallido" y la "Página de pago cancelado". El menú desplegable tendrá la lista de páginas actualmente en su sitio de WordPress.

Además de configurar las páginas, puede configurar la moneda, como se muestra en la imagen anterior.

WP Simple pay lite payment confirmation

El siguiente es el Confirmación de pago ficha.

Estos son los mensajes que se muestran cuando el pago se realiza correctamente. Puede personalizar la información que se mostrará en la página de éxito haciendo uso de las 'Etiquetas de plantilla disponibles' mencionadas en la página.

Vuelve al Configuración de Stripe y haga clic en Conectar con Stripe para configurar Stripe con su sitio web WordPress.

WP simple pay setup

Si ya tiene una cuenta con Stripe, haga clic en Iniciar sesión en la parte superior derecha de la página. Si desea crear una cuenta nueva, rellene el formulario y active su cuenta.

Una vez activada su cuenta, la dirección de correo electrónico utilizada durante el registro aparecerá como "Administrador (Propietario)" y su cuenta de Stripe se conectará, como se muestra a continuación.

WP simple pay lite connect to stripe

Paso 3: Crear un formulario de pago

El siguiente paso es crear un formulario de pago. Vaya a Simple Pay Lite > Formularios de pago. Todos los formularios creados para su sitio WordPress aparecerán en esta página.

Como tenemos que crear nuestro primer formulario de pago, haga clic en Añadir nuevo.

WP Simple pay lite new payment form

Añada un título a su formulario de pago. Esto es para su referencia y no se mostrará en la parte frontal de su sitio de WordPress.

WP Simple pay lite payment form options

Además del título, tendremos que introducir los detalles de las pestañas restantes, es decir, "Opciones de pago", "Visualización de formulario en el sitio" y "Visualización de pago con Stripe".

Opciones de suscripción' sólo está disponible en la versión Pro de este plugin y para este ejemplo, vamos a prescindir de la versión Pro.

Para este artículo, estoy vendiendo un libro electrónico.

En virtud de la Opciones de pago he dejado la configuración predeterminada en "Configuración global" en "Modo de pago" y he establecido un "Importe único" de $1.

WP Simple pay lite payment form on site form display

En Visualización de formularios in situ es donde puede personalizar el texto que aparece en el botón de pago. Puede cambiarlo si es necesario.

En el Pantalla de pago Stripe proporcionará detalles sobre su producto. Esta información se mostrará en la página de pago.

Introduzca el nombre, la descripción y una imagen del producto. Si lo desea, también puede personalizar el color y el tipo del botón de envío.

WP Simple pay stripe checkout display setting

También puede optar por recoger la "Dirección de envío" y la "Dirección de facturación" si son relevantes para la transacción.

La última pestaña es si estás planeando ofrecer un modelo basado en suscripciones. Si tiene previsto utilizar suscripciones, necesitará la versión Pro de la aplicación 'Pago simple WP' plugin.

WP Simple pay subscription options

Una vez que haya completado todos los pasos, haga clic en Publicar a la derecha. Encontrará su formulario de pago en Simple Pay Lite > Formularios de pago.

Simple pay like new payment form shortcode

Copie el shortcode, ya que lo necesitaremos en el siguiente paso.

Paso 4: Integrar un formulario de pago de Stripe en su página

Ahora que ya hemos configurado Stripe y tenemos nuestro formulario de pago en marcha, tenemos que incorporarlo a nuestra página o post.

Ir a Páginas > Añadir nueva.

Dé un nombre a su página. Por ejemplo, "Mi página de libros electrónicos", como se muestra en la imagen siguiente.

Add shortcode in wordpress post

Y luego, añade un widget shortcode a tu página.

Simple pay shortcode on post

¿Recuerdas el shortcode que acabamos de copiar? Sigue adelante e incluye el shortcode aquí. Luego publica tu página.

Simple pay Pay with card

Notará que el PAGAR CON TARJETA que aparece en su página. Al hacer clic en el botón, accederá a la página de pago.

Simple pay checkout page

Y ya está, su página de pago está lista. Ya ha aprendido a configurar Stripe con WordPress.

Cómo configurar Stripe con WPForms

Otro método habitual para aceptar pagos es utilizar un formulario. Puede crear un formulario de contacto sencillo o un formulario de reserva e incluir el método de pago junto con él. Cuando se trata de incluir formularios dentro de su sitio de WordPress, WPForms es uno de esos plugins que puedes utilizar.

WPForms es un plugin de formularios muy popular. Los más de 3 millones de instalaciones y una calificación de 5 estrellas son testimonio convincente de que WPForms es una opción favorita.

WPForms le permite crear diferentes tipos de formularios, desde formularios de contacto, formularios de comentarios, formularios de suscripción, formularios de reserva, formularios de donación, y otros tipos de formularios para su sitio WordPress. Selecciona el campo que desees e inclúyelo en tu formulario con solo un clic.

Si desea considerar un formulario de contacto alternativo, consulte nuestro artículo sobre '16 mejores plugins de formularios de contacto [gratuitos y de pago].'. Estamos seguros de que allí encontrará uno.

Para configurar Stripe con WPForms, debe adquirir la versión Pro. Visite la página Sitio web de WPForms para descargar el plugin Pro.

Paso 1: Instalar el plugin WPForms

Adelante instalar el plugin WPForms en el panel de control de WordPress.

Install WP Form wordpress plugin

Ir a WPForms > Complementos.

Install Stripe Addon WPForms

Si usted no ha recogido la versión Pro del plugin, te darás cuenta de la Actualizar ahora en Complemento Stripe.

Ir a WPForms > Configuraciónincluya la clave de licencia que ha obtenido después de actualización a la versión Proy haga clic en Conectar.

WP Forms upgrade

Si se activa correctamente, aparecerá un nuevo icono Pagos pestaña incluida.

Paso 2: Configurar Stripe

WP Form connect to stripe

Volver a WPForms > Complementos y haga clic en el botón Instalar complemento botón bajo Complemento Stripe. Una vez activado el botón de Stripe, deberá rellenar los datos en el apartado "Ajustes de bandacomo se muestra en la imagen anterior.

Los detalles como la clave secreta y la clave del editor se pueden obtener en la página de sus cuentas de Stripe.

Ahora que Stripe está configurado, podemos crear nuestro formulario.

Paso 3: Creación del formulario

Ir a WPForms > Añadir nuevo. Puede elegir entre una lista de plantillas preestablecidas o crear un formulario desde cero seleccionando "Formulario en blanco".

Para este ejemplo, seleccionaré Crear un formulario de contacto sencillo.

Create new WP Form

Una vez que haya decidido los distintos campos de su formulario de contacto, seleccione Raya bajo el Campos de pago.

WP Form fields
WP Form stripe settings

Asegúrese de que dispone del Activar pagos con Stripe marcada, como se muestra a continuación.

Haga clic en Guardar una vez que haya terminado de crear el formulario.

Paso 4: Incluir el formulario en una página

El último paso es incluir el formulario en una página de nuestro sitio WordPress.

Crear una nueva páginae incluir el WPForms widget.

Add WP Forms widget in post

A continuación, seleccione el formulario que ha creado, que en este ejemplo es el formulario Formulario de contacto simple.

Add WP Forms widget in post 2

Publica la página cuando la hayas completado. Y ya está. Ahora ha aprendido cómo configurar Stripe usando WPForms.

Cómo configurar Stripe en WooCommerce

El siguiente método es configuración de Stripe para WooCommerce.

Una vez que haya instalado y activado WooCommerce en su sitio de WordPress, vaya a WooCommerce > Configuración > Pagos.

WooCommerce Payments tab

Verá los métodos de pago disponibles por defecto.

Paso 1: Instalar el plugin de pasarela de pagos Stripe de WooCommerce

Para configurar Stripe tendrá que instalar la aplicación 'Pasarela de pago WooCommerce Stripe' Plugin para WordPress.

Además de aceptar pagos de tarjetas de crédito populares como MasterCard, Visa, American Express, Discover, JCB y otras, el plugin WooCommerce Stripe Payment Gateway permite que tu tienda WooCommerce acepte pagos a través de Apple Pay, Google Pay y Microsoft Pay.

Install WooCommerce stripe payment gateway plugin

Una vez que haya activado el plugin, observará varias opciones que Stripe proporciona. Activa las opciones que mejor se adapten a tus necesidades.

Connect Stripe with WooCommerce

Paso 2: Configurar Stripe para WooCommerce

Para este artículo, configuraremos el Stripe - Tarjeta de crédito (Stripe) opción. Haga clic en Establecer.

Aparecerá la siguiente página.

Stripe WooCommerce Settings

Para conectar su Tienda WooCommerce con Stripe, necesitarás la clave publicable y la clave secreta. Puedes obtener estos datos en tu cuenta de Stripe.

El resto de las opciones de la página de configuración se explican por sí solas, así que elija las opciones adecuadas. Una vez completado, haga clic en Guardar cambios.

Y ya está. Verá que en la página de pago aparece la opción "Tarjeta de crédito (Stripe)", como se muestra en la imagen siguiente.

Stripe Credit card option

Cómo configurar Stripe en Easy Digital Downloads (EDD)

Cuando se trata de vender productos digitales y descargas, además de utilizar los métodos anteriores, otra opción es utilizar el 'Descargas Digitales Fáciles (EDD)' Plugin para WordPress.

Install Easy Digital Downloads wordpress plugin

Con el plugin gratuito para WordPress 'Easy Digital Downloads (EDD)', puedes vender fácilmente libros electrónicos, archivos PDF, plugins para WordPress y otros artículos digitales.

Usted notará las opciones de pago por defecto disponibles con la versión gratuita del plugin. Y no, Stripe no está integrado en la versión gratuita.

Easy Digital Downloads payment gateways setting

Para la integración con Stripe de Easy Digital Downloads, necesitamos la versión premium. Se puede comprar y descargar desde la página 'Pasarela de pago Stripe'.

Easy Digital Downloads stripe payment setting

Una vez que haya adquirido la versión Premium, verá "Stripe" en la sección Pasarelas de pago pestaña bajo Descargas > Configuración. Y sí, 'Descargas' es lo mismo que 'Easy Digital Downloads'.

Haga clic en el botón Raya e introduzca los datos necesarios.

Stripe setting for Easy Digital Downloads

Toda la información anterior puede obtenerse en la página de configuración de su cuenta de Stripe.

Una vez completado, haz clic en Guardar cambios.

edd checkout using stripe

Y ya está. Ha configurado Stripe con Easy Digital Downloads (EDD) y sus páginas de pago podrán aceptar pagos con tarjeta de crédito con Stripe.

Conclusión

Es excepcionalmente fácil configurar Stripe con WordPress. Los cuatro métodos explicados en este artículo se configuran en pocos minutos. Puede optar por las versiones gratuitas o mejorar la funcionalidad y las características mediante la actualización a las versiones premium.

Configurar Stripe dentro de WordPress es más fácil de lo que imaginas y no implica nada más complicado que copiar y pegar los datos de una cuenta a otra.

Nos gustaría conocer tu experiencia. ¿Cuál de los métodos anteriores ha utilizado para configurar Stripe con su sitio de WordPress?

Divulgación: Este blog puede contener enlaces de afiliados. Si realiza una compra a través de uno de estos enlaces, es posible que recibamos una pequeña comisión. Leer información. Tenga la seguridad de que sólo recomendamos productos que hemos utilizado personalmente y que creemos que aportarán valor a nuestros lectores. Gracias por su apoyo.

9 comentarios
  1. Alberto Profile Pic

    Stripe o Paypal ¿cuál me sugieres? Quiero añadir métodos de pago simples a través de mis clientes me pueden pagar, Por favor comparta su aunque conmigo.

  2. Brandon Profile Pic

    ¿Puede usted guiar sobre cómo hacer la codificación? Sin utilizar el plugin. Yo preferiría la pasarela de pago para ser redirigido a la página de la raya.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Astra es gratis. Ahora y siempre.

Creemos que crear sitios web atractivos no debería ser caro. Por eso Astra es gratis para todos. Empieza gratis y amplía con paquetes asequibles.

La descarga está a un solo clic

Download Checklist

REWIND

RESUMEN DEL AÑO

La descarga está a un solo clic

Introduce tu dirección de correo electrónico y sé el primero en enterarte de las actualizaciones y novedades.

Descargar gratis Astra Theme - Modal Popup Form
Scroll al inicio