
Paiement WooCommerce au Maroc : plugin et integration 2026
WooCommerce et le e-commerce marocain en 2026
WordPress alimente aujourd'hui plus de 43 % des sites web dans le monde, et WooCommerce en est l'extension e-commerce la plus utilisee. Au Maroc, cette combinaison connait une adoption croissante : selon les donnees de BuiltWith, WooCommerce represente plus de 35 % des boutiques en ligne marocaines actives, devant PrestaShop et tres loin devant les plateformes SaaS comme Shopify.
Pourquoi cette popularite ? La raison est simple : la majorite des PME et entrepreneurs marocains ont deja un site WordPress, et l'ajout de WooCommerce est une extension naturelle. Pas besoin de migrer vers une nouvelle plateforme, pas d'abonnement mensuel obligatoire, et une liberte totale sur le design et les fonctionnalites.
Mais un obstacle commun se dresse rapidement : comment accepter les paiements par carte bancaire ou par Maroc Pay sur WooCommerce au Maroc ? WooCommerce ne propose pas de solution de paiement native pour le marche marocain. Il faut integrer une passerelle de paiement locale via un plugin ou une integration API personnalisee.
Ce guide couvre tout ce que vous devez savoir : choix du plugin, installation pas a pas, integration API pour les developpeurs, securite, et comparatif des principales solutions disponibles en 2026.
Pourquoi WooCommerce pour le e-commerce au Maroc
Open source et liberte totale
A la difference de Shopify ou d'autres plateformes SaaS, WooCommerce est entierement open source. Vous possedez votre code, vos donnees et votre infrastructure. Pas de contrat propriete qui vous lie a un fournisseur, pas de frais additionnels sur les transactions (sauf ceux de la passerelle elle-meme), et une capacite illimitee a personnaliser l'experience d'achat.
Pour les entrepreneurs marocains qui veulent un controle maximal sur leur boutique — ou pour les agences web qui developpent des solutions pour leurs clients — c'est un avantage determinant.
Cout total de possession
Voici une comparaison simplifiee sur 12 mois pour une boutique de taille moyenne :
| Poste | WooCommerce | Shopify Basic |
|---|---|---|
| Plateforme | Gratuit | 348 USD (~3 600 MAD) |
| Hebergement | 3 600 - 9 600 MAD | Inclus |
| Domaine | 150 MAD | 150 MAD |
| SSL | Gratuit | Inclus |
| Theme premium | 0 - 1 500 MAD (achat unique) | 0 - 1 800 MAD/an |
| Frais transaction passerelle tierce | 0% | 2% (plan Basic) |
| Total estimatif | 3 750 - 11 250 MAD | 5 700 - 7 500 MAD |
Sur le long terme, WooCommerce est generalement plus economique des que la boutique croit en trafic et en volume de transactions.
Ecosysteme WordPress au Maroc
Les developpeurs WordPress sont nombreux au Maroc, ce qui facilite le recrutement ou le recours a des freelances pour les personnalisations. La documentation est disponible en francais, et la communaute locale (meetups WordPress Casablanca, Rabat) est active.
Flexibilite pour les specificites locales
WooCommerce permet d'adapter facilement la boutique au contexte marocain :
- Affichage des prix en dirham marocain (MAD)
- Prise en charge du paiement a la livraison (COD) — toujours majoritaire au Maroc
- Integration du bon de commande pour les achats B2B
- Support multilingue francais / arabe via plugins WPML ou Polylang
Les options de passerelle de paiement WooCommerce au Maroc
Chari Pay (ChariBaaS)
Chari Pay est la solution de paiement de ChariBaaS, congue specifiquement pour le marche marocain et pensee pour les integrateurs WooCommerce.
Points forts :
- Plugin WooCommerce officiel disponible et maintenu
- Support des cartes Visa et Mastercard marocaines et internationales
- Integration native de Maroc Pay (paiement par QR code et portefeuille electronique)
- 3D Secure 2.0 conforme aux exigences de Bank Al-Maghrib
- Sandbox de test complet avec cartes de test documentees
- Webhook temps reel pour les mises a jour de statut de commande
- Dashboard de suivi des transactions
- Support technique en francais et en arabe
- Documentation API RESTful claire pour les developpeurs
Points a considerer :
- Solution plus recente que CMI, notoriete en cours de developpement
- Necessite un compte ChariBaaS actif
CMI (Centre Monetique Interbancaire)
Le CMI est l'infrastructure nationale du paiement electronique marocain, geree par les banques. Toute carte bancaire marocaine est compatible CMI.
Points forts :
- Couverture maximale : toutes les cartes bancaires marocaines sont acceptees
- Confiance etablie : les consommateurs marocains reconnaissent la marque CMI
- Certifie PCI-DSS niveau 1
Points a considerer :
- Pas de plugin WooCommerce officiel — integration via plugins tiers ou developpement custom
- Processus d'onboarding long (plusieurs semaines, documents bancaires requis)
- Interface technique plus ancienne (protocoles SHA-1 legacy sur certains endpoints)
- Support technique moins reactif pour les petites structures
- Frais de setup variables selon la banque acquereuse
Payzone
Payzone est un agregateur de paiement marocain qui simplifie l'acces au paiement en ligne.
Points forts :
- Plugin WooCommerce disponible
- Processus d'inscription relativement rapide
- Support des cartes marocaines et internationales
Points a considerer :
- Moins de documentation technique que Chari Pay
- Support de Maroc Pay variable selon les offres
- Frais a verifier selon le plan
Comparatif rapide
| Critere | Chari Pay | CMI | Payzone |
|---|---|---|---|
| Plugin WooCommerce officiel | Oui | Non | Oui |
| Maroc Pay | Oui | Non | Partiel |
| Sandbox de test | Oui | Oui (via banque) | Oui |
| 3D Secure 2.0 | Oui | Oui | Oui |
| Onboarding | Rapide | Long | Moyen |
| Documentation API | Excellente | Correcte | Correcte |
| Support FR/AR | Oui | Partiel | Partiel |
| Frais transaction | Competitifs | Variables | Variables |
Guide d'installation du plugin WooCommerce pas a pas
Prerequis
Avant de commencer, assurez-vous d'avoir :
- WordPress 6.x installe avec WooCommerce 8.x ou superieur
- Un certificat SSL actif sur votre domaine (HTTPS obligatoire)
- Un compte actif aupres de votre passerelle de paiement (Chari Pay, CMI ou Payzone)
- Vos identifiants commercant : Merchant ID, API Key, Secret Key
Etape 1 : Configurer WooCommerce pour le Maroc
Avant d'installer le plugin de paiement, configurez WooCommerce pour le marche marocain :
- Allez dans WooCommerce > Reglages > General
- Pays de vente : Maroc
- Devise : MAD (Moroccan Dirham)
- Position de la devise : a gauche (DH 250) ou a droite (250 DH) selon votre preference
- Separateur decimal : virgule (,) pour un affichage local ou point (.) selon votre audience
- Nombre de decimales : 2
Dans WooCommerce > Reglages > Livraison, configurez vos zones de livraison avec les regions marocaines (Casablanca, Rabat, Marrakech, etc.) et vos tarifs de livraison.
Etape 2 : Installer le plugin de paiement
Via le tableau de bord WordPress (recommande)
- Allez dans Extensions > Ajouter une extension
- Recherchez le nom du plugin de votre passerelle (ex: "Chari Pay WooCommerce" ou "Payzone WooCommerce")
- Cliquez sur Installer maintenant puis sur Activer
Via upload ZIP
Si le plugin n'est pas dans le repertoire WordPress.org :
- Telechargez le fichier
.zipdepuis le portail developpeur de votre passerelle - Allez dans Extensions > Ajouter une extension > Televerser une extension
- Selectionnez le fichier ZIP et cliquez sur Installer maintenant
- Cliquez sur Activer l'extension
Etape 3 : Configurer le plugin
- Allez dans WooCommerce > Reglages > Paiements
- Localisez votre passerelle dans la liste et cliquez sur Gerer
- Activer : Oui
- Titre : ce que le client verra au checkout (ex: "Paiement par carte bancaire")
- Description : courte description (ex: "Visa, Mastercard — paiement securise 3D Secure")
- Mode : selectionnez Test pour commencer
- Merchant ID : collez votre identifiant commercant
- API Key : collez votre cle API
- Secret Key : collez votre cle secrete (pour la signature HMAC)
- URL de retour : generalement auto-configuree (
/wc-api/[nom_gateway]) - Sauvegardez
Etape 4 : Tester l'integration en mode sandbox
Avant tout mise en production, effectuez des tests complets :
Test 1 — Paiement accepte
- Ajoutez un produit au panier
- Passez au checkout, remplissez les informations
- Utilisez la carte de test "acceptee" fournie par la passerelle
- Verifiez que la commande passe au statut "Traitement" dans WooCommerce
- Verifiez que l'email de confirmation est envoye
Test 2 — Paiement refuse
- Utilisez la carte de test "refusee"
- Verifiez que la commande reste en "En attente de paiement"
- Verifiez le message d'erreur affiche au client
Test 3 — 3D Secure
- Utilisez une carte de test avec 3D Secure active
- Verifiez la redirection vers la page d'authentification bancaire
- Completez l'authentification et verifiez le retour sur WooCommerce
Test 4 — Remboursement
- Depuis WooCommerce > Commandes, ouvrez une commande test payee
- Cliquez sur Rembourser et entrez le montant
- Verifiez que le remboursement est bien initie via le dashboard de la passerelle
Etape 5 : Basculer en mode production
Une fois tous les tests concluants :
- Dans les reglages du plugin, passez Mode de Test a Production
- Remplacez les cles API de test par les cles de production (fournies par votre passerelle)
- Effectuez une transaction reelle avec un petit montant (10 MAD)
- Verifiez le versement sur votre compte bancaire
Integration API personnalisee pour developpeurs
Pour les boutiques avec des besoins avances — flux de paiement sur mesure, application mobile + WooCommerce, ou integration multi-canaux — il est possible de contourner le plugin et d'integrer directement via l'API de la passerelle avec l'API WooCommerce.
Architecture generale
Client (navigateur/app)
│
▼
WooCommerce (creation de commande via REST API)
│
▼
Backend custom (PHP/Node.js)
│
▼
API Passerelle (Chari Pay REST API)
│
▼
Page de paiement bancaire (3D Secure)
│
▼
Webhook de confirmation → WooCommerce Order Update
Creer une commande WooCommerce via REST API
POST /wp-json/wc/v3/orders
Authorization: Basic base64(consumer_key:consumer_secret)
Content-Type: application/json
{
"payment_method": "charipay",
"payment_method_title": "Chari Pay",
"set_paid": false,
"billing": {
"first_name": "Youssef",
"last_name": "Benali",
"email": "youssef@example.ma",
"phone": "+212600000000",
"address_1": "123 Rue Mohammed V",
"city": "Casablanca",
"country": "MA"
},
"line_items": [
{ "product_id": 42, "quantity": 1 }
]
}
Initier le paiement via Chari Pay API
POST https://api.baas.ma/v1/payments/initiate
Authorization: Bearer {API_KEY}
Content-Type: application/json
{
"amount": 25000,
"currency": "MAD",
"order_id": "WC-1042",
"customer": {
"name": "Youssef Benali",
"email": "youssef@example.ma",
"phone": "+212600000000"
},
"return_url": "https://votresite.ma/wc-api/charipay_return",
"cancel_url": "https://votresite.ma/panier",
"webhook_url": "https://votresite.ma/wc-api/charipay_webhook"
}
La reponse inclut un payment_url vers lequel vous redirigez le client.
Traiter le webhook de confirmation
// functions.php ou plugin personnalise
add_action('woocommerce_api_charipay_webhook', function() {
$payload = json_decode(file_get_contents('php://input'), true);
// Verifier la signature HMAC
$signature = hash_hmac('sha256', json_encode($payload['data']), CHARIPAY_SECRET_KEY);
if ($signature !== $payload['signature']) {
http_response_code(401);
exit;
}
$order = wc_get_order($payload['data']['order_id']);
if ($payload['data']['status'] === 'PAID') {
$order->payment_complete($payload['data']['transaction_id']);
$order->add_order_note('Paiement confirme via Chari Pay. Transaction: ' . $payload['data']['transaction_id']);
} elseif ($payload['data']['status'] === 'FAILED') {
$order->update_status('failed', 'Paiement echoue via Chari Pay.');
}
http_response_code(200);
});
Pour aller plus loin, consultez la documentation API ChariBaaS.
Tableau comparatif : CMI vs Payzone vs Chari Pay pour WooCommerce
| Critere | CMI | Payzone | Chari Pay |
|---|---|---|---|
| Type de solution | Banque centrale | Agregateur | BaaS moderne |
| Plugin WooCommerce | Tiers uniquement | Oui | Oui (officiel) |
| Cartes marocaines | Toutes | Oui | Oui |
| Cartes internationales | Oui | Oui | Oui |
| Maroc Pay (QR) | Non | Partiel | Oui |
| Virement bancaire | Non | Non | Oui |
| Sandbox | Via banque | Oui | Oui (autonome) |
| API REST moderne | Non (SOAP legacy) | Partiel | Oui |
| Webhooks | Oui | Oui | Oui (temps reel) |
| 3D Secure version | 1.0 / 2.0 | 2.0 | 2.0 |
| Delai d'onboarding | 3 - 6 semaines | 1 - 3 semaines | Quelques jours |
| Documentation | Correcte | Correcte | Excellente |
| Support technique | Banque uniquement | Email + Chat FR/AR | |
| Dashboard analytique | Basique | Moyen | Complet |
| Frais de setup | Variables (banque) | Variables | Transparents |
| Frais par transaction | 1,5% - 2,5% | 2% - 3% | Competitifs |
Recommandation : pour une boutique WooCommerce qui se lance, Chari Pay offre le meilleur rapport facilite/fonctionnalites. Pour une boutique deja etablie avec un volume important et une relation bancaire forte, CMI reste une option de reference pour la couverture maximale.
Optimiser les conversions de paiement sur WooCommerce
Comprendre les abandons de panier au Maroc
Le taux d'abandon de panier dans le e-commerce marocain depasse 72 % selon les estimations sectorielles — un chiffre superieur a la moyenne mondiale (70 %). Les principales causes identifiees :
- Frais de livraison decouverts seulement au checkout
- Manque de confiance envers le paiement en ligne
- Processus de checkout trop long ou complexe
- Absence du paiement a la livraison (COD)
- Interface non adaptee au mobile
Strategies concretes
1. Afficher les frais tot Configurez WooCommerce pour afficher une estimation des frais de livraison des la page panier. Evitez les mauvaises surprises au dernier moment.
2. Proposer le paiement a la livraison (COD) Le COD reste le moyen de paiement dominant au Maroc, utilise par plus de 60 % des acheteurs en ligne. Activez-le dans WooCommerce > Reglages > Paiements > Paiement a la livraison et reflechissez a une majoration de 10-20 MAD pour inciter au paiement en ligne.
3. Ajouter Maroc Pay Le portefeuille electronique Maroc Pay cible les clients bancarises partiellement (postes bancaires, agents) qui n'ont pas necessairement de carte. L'ajout de ce mode de paiement via Chari Pay elargit votre base de clients potentiels.
4. Badges de confiance au checkout Affichez les logos : cadenas SSL, Visa Secure, Mastercard Identity Check, 3D Secure. Ces elements visuels reduisent l'anxiete d'achat, particulierement chez les nouveaux acheteurs en ligne.
5. Simplifier le formulaire checkout Utilisez un plugin de checkout one-page (ex: CheckoutWC). Supprimez les champs inutiles. Pre-remplissez la ville selon le code postal.
6. Optimiser pour mobile En 2026, plus de 75 % du trafic e-commerce marocain vient du mobile. Votre theme WooCommerce et votre page de paiement doivent etre parfaitement responsive.
7. Emails de relance de panier abandonne Installez un plugin de recuperation de panier abandonne (ex: CartFlows, Abandoned Cart Lite) pour envoyer des rappels automatiques apres 1h, 24h et 72h.
Securite et conformite PCI-DSS
Les exigences de Bank Al-Maghrib
Bank Al-Maghrib exige que tout systeme de paiement electronique au Maroc respecte les normes internationales de securite. Pour les boutiques WooCommerce, cela implique :
- HTTPS obligatoire sur l'ensemble du site (certificat SSL valide)
- 3D Secure pour toutes les transactions par carte
- Pas de stockage de donnees de carte sur votre serveur
- Journalisation des transactions pour audit
PCI-DSS et le role de la passerelle
La bonne nouvelle : si vous utilisez une passerelle de paiement certifiee (Chari Pay, CMI, Payzone), votre boutique WooCommerce est en mode SAQ A (le niveau de conformite PCI-DSS le plus simple). Cela signifie que :
- Le formulaire de saisie de carte est heberge par la passerelle, pas sur votre serveur
- Vos donnees de carte ne transitent jamais par votre infrastructure
- La responsabilite de la securite des numeros de carte incombe a la passerelle certifiee PCI-DSS niveau 1
Securiser votre WordPress/WooCommerce
Au-dela de la conformite paiement, protegez votre installation WordPress :
- Maintenez WordPress, WooCommerce et tous les plugins a jour — la majorite des compromissions exploitent des vulnerabilites connues dans des versions obsoletes
- Utilisez un plugin de securite (Wordfence, Sucuri) pour surveiller les tentatives d'intrusion
- Sauvegarde quotidienne de votre base de donnees et de vos fichiers
- Authentification a deux facteurs (2FA) pour l'acces admin WordPress
- Limitez les tentatives de connexion (plugin Limit Login Attempts)
- Desactivez XML-RPC si vous ne l'utilisez pas (vecteur d'attaque commun)
- Utilisez un WAF (Web Application Firewall) — Cloudflare en propose un gratuit
3D Secure 2.0 : avantages concrets
Le 3D Secure 2.0 (Visa Secure, Mastercard Identity Check) apporte des ameliorations significatives par rapport a la version 1 :
- Authentification sans friction pour les transactions a faible risque (pas de redirection)
- Meilleure experience mobile — authentification biometrique possible
- Partage de donnees enrichi avec la banque emettrice pour reduire les faux positifs
- Transfert de responsabilite en cas de fraude vers la banque emettrice (chargeback protection)
Assurez-vous que votre passerelle supporte le 3DS 2.0 et pas seulement la version 1 legacy.
Conformite avec la loi 09-08 (protection des donnees)
La collecte de donnees personnelles au checkout (nom, email, telephone, adresse) est soumise a la loi marocaine 09-08 relative a la protection des donnees personnelles. Assurez-vous :
- D'afficher une politique de confidentialite claire
- D'obtenir le consentement explicite pour les communications marketing
- De vous conformer aux obligations de la CNDP (Commission Nationale de controle de la protection des Donnees a caractere Personnel)
Pour les boutiques qui traitent des volumes importants, une declaration aupres de la CNDP peut etre requise.
Comment ChariBaaS peut vous aider
Integrer un systeme de paiement WooCommerce robuste au Maroc n'est pas trivial — entre les specificites techniques, les exigences reglementaires et les attentes des consommateurs marocains, les ecueils sont nombreux. ChariBaaS via Chari Pay a ete concu precisement pour simplifier ce parcours.
Ce que ChariBaaS apporte a votre boutique WooCommerce
Plugin pret a l'emploi Notre plugin WooCommerce officiel s'installe en quelques clics et se configure en moins de 30 minutes. Pas besoin d'un developpeur pour une integration de base.
Tous les moyens de paiement marocains
- Cartes Visa et Mastercard (marocaines et internationales)
- Maroc Pay (QR code, portefeuille electronique)
- Virement bancaire (pour le B2B)
- Cash on delivery (COD) — gestion unifiee dans un seul dashboard
API RESTful moderne pour les developpeurs Pour les boutiques avec des flux personnalises, notre API REST offre une documentation claire, un SDK PHP disponible, et un environnement sandbox autonome — sans dependre d'un interlocuteur bancaire.
Conformite integree 3D Secure 2.0, PCI-DSS niveau 1, chiffrement TLS 1.3 — la securite et la conformite sont gerees par ChariBaaS, pas par vous.
Dashboard unifie Suivez toutes vos transactions WooCommerce, vos remboursements et vos versements depuis une seule interface. Export comptable en un clic.
Versement rapide Reglement sur votre compte bancaire marocain sous J+1 ouvre (selon votre offre).
Support en francais et en arabe Notre equipe technique repond en francais et en arabe — pas besoin de communiquer en anglais avec un support offshore.
Pret a integrer le paiement en ligne sur votre boutique WooCommerce ? Explorez notre service de paiement en ligne ou consultez notre documentation API.
Vous lancez votre boutique ou vous migrez depuis une autre plateforme ? Contactez notre equipe — nous vous accompagnons etape par etape.
Voir aussi : Paiement Shopify au Maroc | Reglementation des etablissements de paiement au Maroc | Portefeuille electronique et Maroc Pay
Questions fréquentes
- Quelle est la meilleure passerelle de paiement WooCommerce au Maroc ?
- Chari Pay est recommande pour sa facilite d'integration, ses APIs RESTful modernes, le support natif de Maroc Pay et un sandbox de test complet. CMI est le standard historique pour les cartes marocaines mais necessite plus de configuration. Le choix depend de votre volume, de vos moyens de paiement cibles et de votre capacite technique.
- Existe-t-il un plugin WooCommerce pour CMI au Maroc ?
- CMI ne publie pas de plugin officiel sur le WordPress Plugin Directory, mais des plugins tiers developpes par des agences marocaines existent. L'integration se fait generalement via redirection vers la page de paiement CMI. Pour une integration plus robuste, l'API CMI peut etre utilisee directement via WooCommerce Payment Gateway API.
- WooCommerce est-il gratuit pour vendre au Maroc ?
- WooCommerce est un plugin WordPress open source gratuit. Les couts comprennent : hebergement (200 a 800 MAD/mois), nom de domaine (100 a 200 MAD/an), certificat SSL (gratuit avec Let's Encrypt), theme premium (optionnel), et frais de transaction de la passerelle de paiement (1,5% a 3,5%). C'est souvent moins couteux que Shopify sur le long terme.
- Comment tester un plugin de paiement WooCommerce au Maroc sans carte reelle ?
- Activez le mode sandbox de votre passerelle de paiement (Chari Pay, CMI, Payzone) dans les parametres du plugin WooCommerce. Chaque fournisseur fournit des numeros de carte de test, des codes CVV et des dates d'expiration permettant de simuler des paiements acceptes, refuses et des redirections 3D Secure sans debiter de vrai compte.