Vamos a ver en este post cómo podemos añadir y configurar Stripe con Woocommerce, para que se puedan realizar pagos con tarjeta en nuestra tienda online.
En este post vamos a suponer que ya conoces lo que es Stripe y que te has creado una cuenta. En caso de que no sepas que es Stripe o no te hayas creado una cuenta, echa un vistazo al apartado 1) y al apartado 2) de este post: Que es y cómo configurar Stripe en Prestashop
DISFRUTA DE TODOS MIS CURSOS PREMIUM POR SOLO 10€/MES
ÍNDICE CÓMO AÑADIR STRIPE A WOOCOMMERCE
1.- Instalar plugin Stripe para Woocommerce
Para poder utilizar Stripe en nuestro Woocommerce debemos instalarnos el plugin gratuito: “Woocommerce Stripe Payment Gateway”. Es posible que ya lo tengas instalado. Para poder comprobarlo, accede a la administración de tu wordpress y ves a: “Plugins > Plugins instalados”. Revisa si aparece ahí el plugin. Si no está, procede a instalarlo.
Para instalarte el plugin “WooCommerce Stripe Payment Gateway” accede a la administración de tu wordpress y ves a: “Plugins > Añadir nuevo”. En la barra de búsqueda introduce el nombre del plugin: WooCommerce Stripe Payment Gateway.
Localiza el plugin entre los diferentes resultados y haz clic en el botón: “Instalar ahora”. Una vez instalado haz clic en el botón “Activar”.
2.- Activar método de pago: Stripe – Tarjeta de crédito (Stripe)
Ahora es el momento de activar el método de pago principal de Stripe. Para lo que iremos a: “Woocommerce > Ajustes” y haremos clic en la pestaña: “Pagos”.
A continuación, verás que hay diferentes métodos de pago relacionados con Stripe. Lo que haremos será “activar” solo el método de pago: “Stripe – Tarjeta de crédito (Stripe)” que es el primero de los diferentes métodos de pago que se muestran, que están relacionados con Stripe.
Para activarlo, simplemente tendremos que hacer clic en el selector de la columna: “Activado”.
3.- Crear cuenta Stripe y activarla
Para poder configurar el plugin de Stripe para Woocommerce es necesario haber creado previamente una cuenta en Stripe y tenerla activada.
En el apartado 2 de este post tienes una guía de los diferentes pasos a seguir: Qué es y cómo configurar Stripe en Prestashop
Es importante que verifiques que estás viendo los datos de tu cuenta de Stripe reales y no los de prueba. Puedes hacerlo viendo el selector que hay en la barra de menú lateral de tu cuenta de Stripe. Verás que hay un ítem de menú (que es un selector) con el nombre: Ver datos de prueba. Pues el selector debe estar desactivado.
4.- Configurar plugin de Stripe en Woocommerce
Para configurar el plugin de Stripe en Woocommerce iremos a: “Woocommerce > Ajustes” y haremos clic en la pestaña “Pagos”. A continuación, haremos clic en el botón “Configuración” del método de pago: “Stripe – Tarjeta de crédito (Stripe)”
Vamos a ir viendo las diferentes opciones:
a.- Activar/Desactivar: ha de estar marcado el checkbox. Si no lo tienes marcado, márcalo.
b.- Título: este texto se mostrará a tus clientes como título de esta forma de pago. Puedes editarlo si quieres.
c.- Descripción: este texto se mostrará a tus clientes como descripción o explicación de esta forma de pago. Si quieres, puedes editarla también.
d.- Modo de pruebas – Activar modo pruebas: es imprescindible que este checkbox esté desmarcado para que Stripe funcione en modo real. Por lo que, desmarca este checkbox.
Para rellenar los siguientes apartados deberás acceder a tu cuenta de cliente de Stripe e ir a “Desarrolladores > Claves de API”. Ahí verás que tienes dos claves: la clave publicable y la clave secreta.
e.- Clave de producción publicable: desde tu panel de cliente de Stripe “Desarrolladores > Claves de API”, copia la clave publicable y pégala en este campo.
f.- Clave de producción secreta: para obtener esta clave debes hacer clic en el botón: “Revelar token de clave activa”. (aparte de pegar esta clave en el campo correspondiente de la configuración de Woocommerce, te recomiendo que te guardes esta clave en una hoja de Word o donde quieras que en un futuro te permita recuperarla, ya que en ocasiones Stripe limita su visualización. Seguramente, ya no te volverá a hacer falta, pero por si las moscas)
g.- Firma secreta del webhook: para este apartado, debes acceder a la administración de cliente de Stripe e ir a “Desarrolladores > Webhooks”.
A continuación, en el apartado “Puntos de Conexión” haz clic en el botón “Añadir un punto de conexión”
Copia la url de la variable del webhook que tienes en tu Woocommerce, concretamente lo tienes en la configuración del plugin Stripe en Woocommerce y pégala en el campo “URL del punto de conexión”. A continuación haz clic en el enlace: “recibe todos los eventos”. Finalmente haz clic en el botón: “Añadir punto de conexión”.
Ahora en el apartado: “Secreto de firma”, haz clic en el botón: “hacer clic para revelar”. Copia el código que te aparece y pégalo en el campo: “Firma secreta del webhook” que tiene en la configuración del plugin de Stripe para Woocommerce.
Si este apartado te lía un poco, mira el procedimiento en el vídeo que tienes en la parte superior.
h.- Formulario integrado para la tarjeta de crédito: este checkbox va a definir la apariencia del formulario para introducir los datos de la tarjeta. Si el checkbox está desmarcado, los campos de nº de tarjeta, fecha de caducidad y cvv aparecerán separados unos de otros. Si por el contrario, marcamos este checkbox solo aparecerá un único campo donde introducir el nº de tarjeta, fecha de caducidad y cvv.
i.- Descripción del extracto: este será el texto identificativo que le aparecerá al cliente en los pagos realizados a través de tu tienda online. Por lo que lo normal sería poner el nombre de tu tienda en este campo.
j.- Captura: es muy importante que tengas MARCADO este checkbox “Captura el cargo inmediatamente”, para que los cargos se hagan efectivos.
k.- Botones de petición de pago: Esta opción sirve para poder aceptar pagos a través de Apple Pay o Chrome Payment (según el navegador utilizado). Esto se refiere a que se podría pagar en un solo clic ya que los datos de facturación y pago se podrían obtener de la cuenta de Google o Apple, según el navegador que esté utilizando el cliente. Si no quieres activar esta opción desmarca el checkbox.
Las siguientes opciones solo tienen sentido en caso de tener esta opción marcada. Dichas opciones están relacionadas con las estética de dicho botón.
l.- Tarjetas guardadas: esta opción permite que el cliente pueda volver a pagar con una tarjeta que haya guardado. Los datos de la tarjeta se guardan en Stripe. Es decir, si marcamos esta opción los clientes podrán utilizar para pagar una tarjeta que ya han utilizado alguna vez.
A continuación guarda todos los cambios y listo. Ya puedes realizar alguna prueba de compra en tu tienda usando una tarjeta de crédito.
Me encanta el diseño web y el mundo del ecommerce. Apasionado de Prestashop, Woocommerce/Wordpress y de la formación. Me gustaría que este blog te sirviera de ayuda para poner en marcha e ir mejorando y evolucionando tu tienda online. Ya seas un profesional del sector o no, seguro que encontrarás mucha información de valor e interés aquí.
hola , por que no me aparece la opción de diferir a eses sin intereses en mi pasarela de pagos, acepta el pago con tarjeta de crédito y lo hace más sin embargo no me da la opción de meses sin intereses, lo tengo activado en stripe a 3 meses, pero no me manda esa opción al hacer el pago.
con tu tutorial lo puse la pasarela de pago em mi web pero me da un error de clave publicitaria la he metido mil veces y sigue dando error a la hora en que el cliente compra… no se como solucionarlo ya
Buenas.
En ese caso, yo lo que haría sería recurrir al soporte de Stripe para que me lo analizaran. Me gustaría también invitarte, si es posible, a que eches un vistazo a mi plataforma de formación https://cursotiendaonline.com/ desde donde puedes Acceder a TODOS mis cursos online por solo 10 €/mes (Incluye ¡¡SOPORTE!!). En la plataforma tienes cursos sobre WordPress, Curso como crear una tienda online de éxito, Woocommerce, plantillas wordpress como flatsome, Divi, Astra pro, cursos Analytics ecommerce, seo general, SEO tiendas online, etc. etc.
Muchas gracias! me ha sido de gran ayuda!
Hola Marta. Me alegro que te sirviera el post. Me gustaría también invitarte, si es posible, a que eches un vistazo a mi plataforma de formación https://cursotiendaonline.com/ desde donde puedes Acceder a TODOS mis cursos online por solo 10 €/mes (Incluye ¡¡SOPORTE!!). En la plataforma tienes cursos sobre WordPress, plantilla Astra, Woocommerce, Elementor, SEO General, SEO Link building, SEO Tiendas online, Analytics, Mailchimp, etc. etc.
Hola Joaquin!
Tremendo el tutorial, acabo de utilizarlo para integrar stripe con un woocomerce y me surge una duda. He activado el modo de pruebas de stripe, he realizado un pedido y parece que ha ido bien, pero la plataforma no me ha enviado ningun correo de pedido realizado ni nada. Esto es normal? Solo manda correos en modo «real»?
Muchas gracias!
Un saludo.
Buenas Rober.
Es posible, puedes confirmarlo con el soporte de Stripe. Yo normalmente ya pruebo directamente en el real. Como se puede reembolsar el importe
En los ajustes de pago woocommerce yo tengo asi: Debes añadir la siguiente variable del webhook
http://yogacurso.es/?wc-api=wc_stripe…. y stripe acepta en formahttps://......Al final no se configura. Supongo que por este motivo. Si podrias recomendar algo? Saludos. Gleb
Hola Gleb.
No es posible utilizar Stripe si tu web no tiene certificado SSL
Si tu web usa una url del tipo
http://, es que tu web no usa SSL. Tampoco podrás usar PayPal, pues también es necesario certificado SSLHola Joaquín, sabes si han cambiado la forma de configurar apple pay en stripe? Se necesita una id?
Y he confgurado stripe bien, y en woocommerce, como dices, y no me sale el botón. Estoy en Chrome, sabes porqué?
Mil gracias!
Un abrazo!
Hola María.
Aquí tienes info sobre Apple Pay y un botón para hacer cualquier consulta sobre el tema a Stripe
https://stripe.com/es/apple-pay