Publié par Christine Siembida le 12 décembre 2019 • 24 Commentaires

Stripe et WordPress, tout a commencé avec une histoire de règlement par carte bancaire oubliée…

Pas plus tard que la semaine dernière, je discutais avec un ami qui se demandait pourquoi il avait un taux de rebond aussi important sur la page de paiement de sa boutique en ligne.

En premier lieu, j’ai analysé son site créé sous WordPress et… devinez quoi ?

Je me suis aperçue qu’il n’avait pas intégré la carte bancaire comme moyen de paiement.

femme étonnée
C’est pas possible !

Alors là, je n’en revenais pas…quelle erreur…puisque le paiement par carte bancaire représentait environ 80 % de la valeur des ventes de produits en ligne en France, en 2018.
Source : étude de la FEVAD

Moyens de paiements en ligne 2018
Source : Statista/ Moyens de paiement utilisés lors d’un achat en ligne en France 2018

J’espère que vous n’avez pas commis la même boulette.
Si…
Oh la la, il va falloir rectifier le tir alors…

Et puis, je vous vois venir… la première question que vous vous posez est : comment vais-je bien pouvoir faire pour intégrer ce mode de paiement sur ma boutique WooCommerce ?

En tout premier lieu, vous allez penser, comme beaucoup, qu’il n’existe que les solutions traditionnelles comme la passerelle de paiement en liaison avec une banque (Monético, Atos, Paybox ou Systempay…).
Alors, vous allez contacter votre banque et souscrire un contrat VAD (vente à distance) et un contrat TPE (Terminal de Paiement Électronique).
Ou bien, vous allez recourir aux services d’un PSP tiers (Partenaires en Solution de Paiement) comme PayLine, PayZen, PayBox, Braintree.

Mais, il existe une autre alternative…si… si…je vous assure.

je n'en crois pas mes yeux
Vraiment ?

J’ai découvert, LA solution tout-en-1, Stripe, un moyen de paiement en ligne sécurisé par carte bancaire. Elle comporte des outils de reporting et permet même de collecter des fonds ou des dons.

En effet, Stripe, tout comme les autres moyens de paiement, a son lot d’extensions pour WordPress. Cela va du simple bouton d’achat ou de don, jusqu’à l’intégration dans un formulaire ou même dans une solution d’e-commerce.
De ce fait, vous allez inévitablement trouver la vôtre.

Waouh, ça donne l’eau à la bouche tout ça, n’est-ce pas ?
Ça y est…Vous aussi, vous voulez tester Stripe dans votre site sous WordPress.

Alors, c’est parti….

Dans ce tutoriel, je vais vous donner des recettes triées sur le volet pour installer facilement Stripe, la passerelle de paiement incontournable, dans WordPress, mais aussi dans WooCommerce.

Qu’est-ce que Stripe ?

Accueil site stripe

Stripe est un service tiers de paiement en ligne qui permet de réaliser des paiements uniques ou récurrents sous différentes formes : carte bancaire, prélèvement SEPA, Apple Pay, Google Pay, ou encore virement. Simple, rapide et sécurisé, Stripe permet à l’acheteur de rester sur le site marchand pour procéder au règlement.

Bon, comme on ne fait pas une recette sans en connaître les ingrédients, il faut quand même que je vous explique plus en détails quels sont les avantages de Stripe.

Tout d’abord, vous allez créer votre compte facilement et la confirmation sera quasi instantanée.

Ensuite, pour l’enregistrement de vos moyens de paiements, pas de souci, tout est simple également.

Et puis, si vous posez la question sur la réception des règlements de vos clients, ils arriveront sur votre compte sous 7 jours automatiquement…que demande le peuple…

Mais Stripe est aussi :

  • Pratique, ça penche aussi dans la balance

En effet, vous pouvez simuler les règlements et la façon dont ils s’intègrent dans le tableau de bord grâce aux outils de tests avant de passer au mode “live”. Stripe vous fournit même des numéros de cartes bancaires fictifs.

Autre information : vos clients peuvent enregistrer leurs informations de paiement afin de pouvoir effectuer leurs achats futurs en un clic. Ça, c’est cool, les acheteurs aiment lorsque c’est rapide.

Et puis, je ne sais pas chez vous, mais chez moi, les bugs surviennent souvent le week-end… Là, l’assistance est effective 24 heures sur 24, 7 jours sur 7 par téléphone, chat et e-mail, c’est top, non…

De plus, Stripe a pensé à tout : si vous voulez savoir comment se porte votre activité, vous disposez d’outils de reporting complets (graphiques d’analyse en temps réel concernant les résultats de votre entreprise).
Le tableau de bord présente les activités récentes, comme les litiges non résolus ou les vérifications d’identité.

Autre détail qui a son importance : il existe une application pour smartphone qui vous notifie lors de la réception d’un nouveau paiement… savoir en temps réel quand l’argent rentre, c’est motivant.

  • Révolutionnaire, on y retrouve tous les moyens de paiements dont on a besoin et même plus

Vous envisagez d’ouvrir une boutique dans un pays étranger ? Stripe sera à vos côtés puisqu’il gère les paiements internationaux, avec plus de 135 devises disponibles.

Vous avez besoin de de moyens de paiement autres que la carte bancaire (Visa, MasterCard, American Express, Discover, Diners Club, JCB) ? Pas de souci, Stripe propose en sus, comme vous l’avez déjà vu, le prélèvement SEPA, Apple Pay, Google Pay et le paiement par virement.

Vous voulez proposer des paiements récurrents ? C’est également possible.

  • Explicite, pas besoin de chercher dans les petites lignes illisibles du contrat

A ce sujet, le tarif est clair, juste une commission et un montant fixe par transaction.

Tarif Stripe
  • Et surtout…sécurisé, avec la cybercriminalité en recrudescence, c’est essentiel

Stripe est certifié PCI niveau 1, le niveau de sécurité le plus élevé, c’est-à dire qu’il protège les données concernant les cartes bancaires contre le vol et toute utilisation frauduleuse.

En fait, la norme PCI DSS (Payment Card Industry Data Security Standards) définit les exigences minimales en matière de sécurité des données.

Concernant la sécurité de votre compte, Stripe est vraiment au top. Il prend en charge deux méthodes d’authentification en deux étapes dans le but de vous connecter à votre tableau de bord.

En plus de votre identifiant/mot de passe, il vous sera demandé, selon, ce que vous avez paramétré , soit une authentification par SMS, soit une authentification par une application mobile, comme, par exemple, Google Authenticator (disponible pour iOS et Android ).

Et, cerise sur le gâteau…
Stripe est déjà prêt pour « l’authentification forte » , nouvelle norme en vigueur obligatoire depuis le 14 septembre 2019. Celle-ci a pour but de renforcer le niveau de sécurité des paiements et, de ce fait, de mieux protéger les consommateurs. Il s’agit de la deuxième Directive Européenne sur les Services de Paiement (DSP2).

Maintenant que vous connaissez l’ingrédient de base, il est grand temps de passer aux recettes pour intégrer facilement Stripe dans WordPress…

impatients de lire les recettes
On trépigne d’impatience de les lire

Si vous avez fait un tour sur le site de Stripe, vous avez du remarquer que certaines pages de la documentation technique étaient écrites dans la langue de Shakespeare.
Mais, ne vous inquiétez pas, je suis là pour tout vous expliquer…

Avec les extensions que j’ai sélectionnées, vous pourrez ajouter :

  • un bouton de paiement
  • un bouton pour faire un don
  • un formulaire de paiement
  • Un panier d’achat

Je vous ai mis en appétit… Alors, sans plus attendre , passons aux recettes.

Je vous propose : en entrée, la création du compte Stripe, en plat de résistance, toutes les méthodes pour activer la fonctionnalité que vous souhaitez et en dessert, mon avis sur les différentes extensions testées et plus encore.

Allez, c’est parti…

Création du compte Stripe

En premier lieu, cliquez sur ce lien pour créer un compte sur le site de Stripe.

Stripe création compte

Immédiatement, vous recevrez, par courriel, un lien pour confirmer l’adresse e-mail que vous avez fournie.

Ensuite, il vous faudra renseigner, dans le tableau de bord de Stripe, les données obligatoires, et enregistrer votre ou vos comptes bancaires pour les transferts

Stripe activation compte

Notez qu’il est possible de faire des tests en attendant la validation du compte et, franchement, je trouve ça, vraiment bien pensé.

Pour ce faire, il suffit d’activer le mode test dans votre tableau de bord.

Stripe menu test mode

Obtention du certificat SSL

Je vous ai déjà dit que Stripe ne prenait pas votre sécurité à la légère.
Alors, avez-vous le petit cadenas devant l’adresse de votre site ?

Non… Dommage, cela veut dire que votre site n’est pas considéré comme sécurisé, et donc, qu’il n’a pas le protocole HTTPS. Il va falloir remédier à ça tout de suite.

En effet, afin de sécuriser les échanges des données sensibles transmises entre Stripe et votre site, que ce soit pour les transactions bancaires ou même l’actualisation en temps réel de votre tableau de bord, Stripe nécessite que votre site utilise le cryptage SSL / HTTPS.
Alors, ça, c’est vraiment un bon point. Surtout, lorsque l’on sait que, chaque année, en France, comme partout dans le monde, la cybermalveillance fait des milliers de victimes.

Pour rappel, il en va également de votre référencement et, donc, de votre visibilité sur le web. En effet, depuis juillet 2018, Google, mentionne un site qui n’est pas en https, comme non sécurisé.

Par conséquent , si vous n’avez pas encore sauté le pas, il est, à présent, obligatoire de le faire.

Sachez que la plupart des hébergeurs proposent un certificat Let’s Encrypt gratuit. C’est notamment le cas d’o2switch.

Alors, si vous ne possédez pas de certificat SSL pour votre site Web, retrouvez Alex qui vous explique comment passer votre site WordPress en HTTPS.

Besoin d’un hébergeur pour votre site ?

Faites comme WPMarmite, choisissez o2switch. Non seulement les performances sont au rendez-vous mais le support est exceptionnel.

Bon, ça y est, on arrive au moment que vous attendez tant…celui des recettes.

Ajouter un simple bouton de paiement Stripe sur WordPress

WP Simple Pay Lite for Stripe

WP Simple Pay, pour intégrer Stripe à WordPress

Pour commencer, il vous suffit d’installer l’extension gratuite WP Simple Pay Lite for Stripe.

Et voilà, c’est parti pour la configuration de l’extension.

Tout d’abord, il faut vous connecter votre compte Stripe avec l’extension, logique…non…

connexion WP Simple Pay à Stripe

Ensuite, vous serez redirigé vers Stripe.com afin de vous connecter à votre compte existant.

Notons que Simple Pay utilise Stripe Connect, ce qui évite d’avoir à renseigner vos clés API…

Alors, ça y est, vous êtes connecté ?…Ok, on continue…

Paramétrage

L’interface est en anglais, mais je vais vous guider pas à pas. Vous verrez, ce n’est pas compliqué.

Onglet setup
WP Simple Pay paramétres Stipe

Il suffit de renseigner votre pays de résidence (France), qui, par défaut, est sur United States. Surtout, n’oubliez pas de mettre le « test mode » sur « enabled ».

Je vous recommande de rester en mode test jusqu’à ce que vous ayez terminé de configurer vos formulaires de paiement.

Et puis, comme on ne le répète jamais assez, n’oubliez surtout pas de valider vos changements.

Onglet général
WP Simple Pay paramètres généraux

Dans un premier temps, renseignez votre monnaie (Euros) dans currency options, car, par défaut, WP Simple Pay utilise l’USD comme devise.

Ensuite, choisissez les pages par défaut ou d’autres de votre choix pour Payment Success Page (paiement validé) et Payment Failure Page (paiement refusé) et validez.

Onglet Payment confirmation
WP Simple Pay paramétrage page de confirmation de paiement

Je suis sûre que vous avez envie de mettre votre grain de sel dans le texte de confirmation que recevront vos clients après leur achat.

Normal, vous n’êtes pas Monsieur ou Madame tout le monde, vous avez votre propre personnalité.

C’est donc ici que ça se passe. Tout est en anglais, par conséquent, il vous faudra remplacer les termes et donnez votre french touch à votre formulaire.

Un truc qui est sympa aussi : vous pouvez intégrer la couleur de votre marque à votre formulaire…Rendez-vous dans votre tableau de bord Stripe (Paramètres/Marque) et personnalisez la couleur de fond de l’icône et de l’en-tête des e-mails.

Stripe personnalisation couleur du formulaire
Création de votre premier formulaire de règlement

En premier, cliquez sur payment forms.

WP Simple Pay accès paramètrage du formulaire de règlement

Puis, cliquez sur Add New, une nouvelle page de formulaire de paiement est créée, il suffit de renseigner le nom désiré.

WP Simple Pay ajout formulaire de paiement

Ici, vous pouvez choisir si la page affichée sera celle indiquée dans Simple Pay> Settings> General (Global Setting) ou une page que vous avez créée (Specific Page) ou bien encore une page s’affichant par redirection (Redirect URL).

Si vous souhaitez afficher ce bouton à un endroit particulier dans un article, une page ou dans un widget texte, il suffira d’ajouter le shortcode qui est indiqué à droite dans cette page.
Exemple : [simpay id=”26”]

Onglet On-Page Form Display

Créer un bouton, c’est bien, mais je pense que vous vous demandez comment modifier le texte en anglais, qui est affiché sur le bouton.

Alors, ne cherchez pas, c’est ici.

Vous pouvez également choisir si vous voulez le modèle de bouton Stripe ou celui de Simple Pay…

Voici à quoi ressemblent les deux versions.

Perso, j’ai une préférence pour le “stripe blue”, il est plus design et moderne, mais, comme on dit, les goûts et les couleurs…Alors, à vous de choisir celui que vous préférez.

WP simple Pay bouton Stripe Blue
Stripe blue
WP Simple Pay bouton par défaut
Default
Onglet Stripe Checkout Display

On va dire qu’ici, c’est l’endroit pour mettre votre marque en valeur sur le formulaire de paiement.

Vous pouvez y indiquer le nom de la société, ajouter un logo ou une image.

Voilà, c’est tout pour la configuration, passons aux tests.

Test de fonctionnement avec un paiement factice

Point important, assurez-vous que Simple Pay est toujours en mode test.

Pour vérifier si c’est bien le cas, regardez en haut, à droite, si vous avez bien l’information ci-dessous.

WP Simple Pay vérification mode test actif

Vérifiez que votre compte Stripe est également en mode test dans votre tableau de bord Stripe pour voir les transactions.

Stripe vérification mode test actif

Tout est OK ? Alors, on poursuit…

Rendez-vous sur la page de formulaire de paiement, soit en l’éditant et en cliquant sur preview, soit sur la page où vous avez inclus le bouton, puis, cliquez sur le bouton.

Là encore, Stripe a tout prévu, vous pourrez utiliser des numéros de cartes test fournis, le plus connu étant 4242 4242 4242 4242 avec la date d’échéance et le code de sécurité de votre choix.

Et voilà ce que ça donne…pas mal, hein…

WP Simple Pay test formulaire de paiement

D’autre part, si vous souhaitez visualiser le règlement et le reçu, direction votre tableau de bord (dashboard) sur le site de Stripe.

Vous êtes satisfait du résultat ?

Alors, désactivez le mode test dans les réglages de Simple Pay Lite pour passer au mode réel. Franchement, avouez que ça serait idiot que vos clients ne puissent pas vous payer.

Peut-être, vous demandez-vous si vous pouvez inclure des paiements récurrents par abonnement et s’il existe la possibilité d’y adjoindre, si besoin, des frais d’installation et des périodes d’essai gratuites.

Eh bien, c’est dommage, mais, dans la version lite, ce n’est pas possible, il vous faudra passer à une licence WP Simple Pay Pro Plus ou supérieure.

Ajouter un bouton de don Stripe sur WordPress

WP Simple Pay lite for Stripe

Eh oui, encore elle…

Elle me fait penser à un couteau suisse, vous pourrez l’utiliser pour un montant de don fixe.

Pour ce faire, reprenez le tutoriel détaillé ci-dessus WP Simple Pay Lite for Stripe.

Modifiez le texte sur le bouton, renseignez le montant du don et le tour est joué.

Vous aimeriez avoir une autre alternative ? Eurêka, j’ai cherché et j’ai trouvé.

Stripe Payments

Stripe Payments Plugin

Evidemment, Stripe Payments n’est pas aussi populaire que WP Simple Pay, mais, elle a pour avantage de pouvoir accepter des montants de dons personnalisés …sympa, ça laisse le choix à vos généreux donateurs.

Il est à noter que vous pourrez également l’utiliser pour le règlement des achats.

Paramétrage

Chouette, son interface est en français. Cette fois-ci, je ne vais pas détailler tout le paramétrage, car, c’est extrêmement simple à renseigner…

Onglet réglages généraux

Bon, petit couac, il faut renseigner les clés API de Stripe dans Stripe Payments/Réglages.

Stripe Payments clés API

Néanmoins, rassurez-vous, il n’y rien de très compliqué en soi.
Vous les trouverez dans votre tableau de bord de Stripe (dashboard) sous l’onglet développeur/clés API.

Il existe 2 sortes de clés, des clés pour tester et des clés lorsque vous serez en mode production.

Attention à celles que vous indiquez !
En effet, Les clés de l’environnement de test ne fonctionnent qu’en mode test.
Lorsque vous êtes prêt à passer en mode réel, il vous faudra les remplacer par les clés API de l’environnement de production, sinon, les paiements en direct ne seront pas traités.

Stripe emplacement clés API

Par défaut, le mode test est activé. Il vous suffit de renseigner la devise et le texte du bouton.

Onglet réglages d’e-mail

Ici, vous pourrez personnaliser les textes des emails à envoyer à vos donateurs, le format d’e-mails (brut, c’est-à dire en version texte, ou HTML avec possibilité de mise en forme et d’insertion d’images).
Perso, je trouve le mode html plus convivial.

Onglet réglages avancés

Là, il s’agit du paramétrage visuel, rien de bien méchant.

Si vous souhaitez changer le texte « pay » du bouton du popup par « donner », c’est ici que ça se passe : Payment Popup Button Text

Pensez juste à décocher la case Enable Legacy Checkout API dans les réglages additionnels afin de pouvoir accepter les paiements nécessitant 3D secure.

Ajout d’un produit

Qui dit un bouton de don ou d’achat, dit un produit associé, vous devrez donc, en créer un ou plusieurs.

Il suffit de renseigner un titre, une description, le prix et la devise.
Si vous souhaitez que le montant du don soit personnalisé, laissez la case montant vide, sinon, indiquez un montant fixe.

Un petit conseil, si vous ne voulez pas que votre page d’acceptation de paiement s’intitule « Checkout-Result », allez modifier le titre de la page créée sous ce nom.

Oups, j’allais oublier un truc important, vous pouvez également utiliser le shortcode du produit pour placer le bouton de don n’importe où sur votre site.

Vous voulez un exemple de rendu visuel du formulaire avec un joli bouton.
Il suffit de demander…

Stripe payments formulaire de don

Test de fonctionnement avec un paiement factice

Rendez-vous sur la page du produit et cliquez sur le bouton. Une fenêtre apparaît pour renseigner les coordonnées de règlement.

Stripe Payments formulaire règlement du don

Immédiatement après, surgit la confirmation de règlement, signe que tout s’est passé correctement.

Stripe Payments formulaire de confirmation de règlement

Ensuite, vous pourrez visualiser le règlement et le reçu dans votre tableau de bord de Stripe (dashboard).

Vous êtes satisfait ?

Dans ce cas, il ne vous reste plus qu’à activer les paiements réels en allant dans les réglages de Stripe Payments et en activant le mode de production.

Stripe Payments activation du mode production

Dernière recommandation, et non pas des moindres : si vous utilisez des extensions de cache sur votre site, excluez la page de résultat de commande pour éviter les dysfonctionnements…

Maintenant, assez joué avec les boutons, on passe à la suite…

Intégrer Stripe dans un formulaire de commande personnalisé sur WordPress

Mais, peut-être qu’avoir un bouton de paiement ne vous suffit pas, vous voulez pouvoir l’intégrer dans un formulaire de commande personnalisée ?

Alors, j’ai une bonne et une mauvaise nouvelle pour vous…

Bonne nouvelle, un add-on pour Stripe est disponible pour tous les plugins de formulaires. Il permet de recevoir des paiements uniques par carte, mais, également des abonnements de paiements récurrents.

Mauvaise nouvelle, mais il n’y a pas d’extension gratuite pour le faire.

personnage qui pleure
Non, ce n’est pas possible, comment vais-je faire ?

Ne pleurez pas, je vais quand même vous indiquer les principales extensions que j’ai sélectionnées et qui font le job.

Tout d’abord, Gravity Forms, avec la licence Elite qui coûte 259 $/an
Pour paramétrer l’add-on, rendez-vous dans leur documentation.

Mais aussi, WPForms, avec le plan Pro à 599.00$/an
Pour installer et utiliser Stripe avec WPForms, c’est par ici.

Et enfin, Ninja Forms, avec son add-on à 49 $/an pour 1 site, 79 $ jusqu’à 5 sites et 129 $ jusqu’à 20 sites.

Pour Ninja Forms, il existe également des packs avec plus de fonctionnalités incluses : Agency 499$/an et Professional 199$/an. A vous de voir ce que vous préférez, selon votre budget et vos désidératas.…

Ça vous dit que je vous explique comment procéder avec l’extension pour Ninja Forms ?

Oui…

Vos désirs sont des ordres… Allons-y !

Ninja Forms et son add-on pour Stripe

Ninja Forms plugin

Génial, il est gratuit, alors ne vous en privez pas. Téléchargez-le, installez-le et activez-le.

Dans l’ensemble , je trouve que Ninja Forms est vraiment complet. Il possède pas mal de champs disponibles et donc permet beaucoup de personnalisation.
L’interface est en drag & drop (glisser-déposer).
De plus, c’est un concurrent sérieux pour GravityForms, mais ça, Alex vous en a déjà parlé.

Alors, si vous n’avez pas besoin des add-ons, il peut être idéal pour vous, sinon, faites quand même attention, car, en cumulant plusieurs add-ons payants, l’addition annuelle peut vite se révéler salée.

Par contre, pour intégrer Stripe, ce n’est pas gratuit, il faut, en premier lieu, acheter l’add-on Ninja Forms-Stripe.

Paramétrage

Rendez-vous dans les réglages. Il suffit, là encore, d’entrer vos clés API de test ou live et d’enregistrer.
(Pour rappel, elles se trouvent dans votre tableau de bord Stripe (dashboard) sous développeurs/clés API).

Ninja Forms Add-on remplissage clés API

Ensuite, il faut créer un formulaire de paiement Stripe.

Ninja Forms création formulaire de paiement

Alors là, c’est magique. On clique sur ajouter/Paiement Stripe et hop, le formulaire apparaît.

Ninja Forms visuel du formulaire de paiement

Ensuite, il ne vous reste plus qu’à l’assaisonner à votre goût en modifiant ce que vous souhaitez dans les Champs du formulaire, les E-mails et actions et Avancé.

Puis, pour changer le texte du bouton lors de la saisie du règlement, il suffit d’aller dans E-mails et actions/Stripe et d’indiquer, par exemple, Payer {{amount}}.

Ninja Forms comment changer le texte du bouton

Surtout, n’oubliez pas d’enregistrer et de publier votre formulaire.

Admirez le résultat…

Ninja Forms bouton de prévisualisation
Ninja Forms Formulaire après changement du texte du bouton

Test de fonctionnement avec un paiement factice

Comme pour les autres extensions, assurez-vous d’être en mode test.
Ce paramètre se trouve dans E-mails et actions/Stripe/ avancés de l’action Stripe.

Ninja Forms passage en mode test

De même, lorsque vous voudrez passer en mode réel, il vous faudra retourner ici, pour désactiver le mode test.

Pour rappel, Stripe fournit des numéros de carte test ici : https://stripe.com/docs/testing

Et là, je ne sais pas pourquoi, j’ai un vieux souvenir qui revient à ma mémoire… Celui de la lessive Bonux, et de son jouet dissimulé dans le baril ! Le fameux cadeau Bonux…

Ta-da ! L’extension prend également en charge des paiements récurrents et aussi les options de montant fixe, de champ et de calcul.

Cette fois-ci, le paramétrage se fait dans E-mails et actions/Stripe/ avancés de l’action Stripe.

Ninja Forms prise en charge des paiements récurrents

On continue ?

homme qui dit oui
Oh oui alors !

Intégrer Stripe dans WooCommerce sur WordPress

Il est impensable de parler d’intégration de moyens de paiement en ligne via Stripe en faisant l’impasse sur WooCommerce, l’extension phare de WordPress en ce qui concerne l’e-commerce.

En effet, savez-vous que sa part de marché représente 27 % des sites ayant une boutique en ligne ?

Si vous ne l’avez pas encore testée, Alex vous dévoile comment installer WooCommerce : L’extension incontournable pour créer une boutique en ligne avec WordPress.

Si vous préférez plutôt les vidéos, Alex vous a également concocté un tutoriel sur notre chaîne YouTube : Comment créer une boutique en ligne avec WordPress & WooCommerce ?

WooCommerce Stripe Payment Gateway

Afin d’intégrer Stripe dans Woocommerce, il vous suffira ensuite d’installer et d’activer Stripe Payment Gateway, l’extension officielle gratuite créée par WooCommerce.

Woocommerce Stripe Payment Gateway plugin

Paramétrage

Direction WooCommerce/onglet paiements.

WooCommerce Stripe Payment Gateway paramétrages

Globalement, tout est très simple dans WooCommerce.

Vous modifiez les textes en anglais et les mettez à votre sauce en français.

Après, comme pour Stripe Payments, il vous faut renseigner les clés API de test qui se trouvent dans votre tableau de bord Stripe (dashboard) sous Développeurs/clés API.

Par contre, cette fois-ci, vous devez également remplir « Test Webhook Secret »

Webhook, kézako ?

En fait, il s’agit, en quelque sorte, d’un numéro de téléphone que Stripe appelle pour prévenir en temps réel WooCommerce des événements qui se produisent sur votre compte Stripe.

Plus simplement, on pourrait définir ça comme un http push, vous savez, les notifications que vous recevez sur votre smartphone.

Comment installer le webhook ?

Une fois de plus, ce n’est pas compliqué du tout.

En premier, vous recopiez le Webhook Endpoints spécifié dans l’onglet paiement de WooCommerce. Puis, vous le collez dans votre tableau de bord Stripe (dashboard) sous Développeurs/webhook/ajouter un endpoint.

WooCommerce webhook comment ajouter endpoint dans Stripe ?

Ceci fait, il ne vous reste plus qu’à découvrir la clé secrète et à l’insérer dans les réglages de WooCommerce.
Un clic et c’est fait.

Stripe découvrir la clé secrète webhook

Test de fonctionnement avec un paiement factice

Alors là, un bon point, pour l’extension, pas besoin de courir chercher des numéros de cartes tests sur Stripe, WooCommerce vous en indique un directement sur la page.

Voilà, à quoi ressemblera le formulaire de paiement.

WooCommerce formulaire de paiement Stripe

Et la validation de commande

WooCommerce validation de commande avec Stripe

Du coup, je choisis quoi ?

Somme toute, je vous ai donné pas mal de pistes pour inclure un paiement via carte bancaire avec Stripe sur votre site sous WordPress.

Globalement, j’ai trouvé le paramétrage super simple pour WooCommerce, Stripe Payment Gateway et l’add-on Ninja Forms-Stripe, mais un peu moins pour WP Simple Pay Lite for Stripe.

En résumé, ils font tous le job, je vous conseille donc de choisir en fonction de votre besoin : un simple bouton d’achat ou de don, un formulaire, une intégration dans une solution d’e-Commerce, mais aussi en fonction de votre budget puisqu’il en existe des gratuits et des payants.

Néanmoins, pour élargir votre recherche, vous pouvez analyser toutes les applications et plugins partenaires de Stripe spécialement conçus pour WordPress.

Et puis, n’en oubliez pas pour autant les autres moyens de paiements.
Si voulez proposer PayPal sur votre site également, je vous propose de consulter l’article de Thibaut, comment intégrer PayPal à WordPress : le guide complet.

Alors, que pensez-vous de Stripe ? Avez-vous trouvé la recette qui vous convient parmi celles que j’ai listées dans mon menu ? En avez-vous d’autres à me proposer ?

N’hésitez pas à tout me raconter en commentaire…