
Paiement WooCommerce au Maroc : plugin et intégration 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 utilisée. Au Maroc, cette combinaison connaît une adoption croissante : selon les données de BuiltWith, WooCommerce représente plus de 35 % des boutiques en ligne marocaines actives, devant PrestaShop et très loin devant les plateformes SaaS comme Shopify.
Pourquoi cette popularité ? La raison est simple : la majorité des PME et entrepreneurs marocains ont déjà 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 liberté totale sur le design et les fonctionnalités.
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 marché marocain. Il faut intégrer une passerelle de paiement locale via un plugin ou une intégration API personnalisée.
Ce guide couvre tout ce que vous devez savoir : choix du plugin, installation pas à pas, intégration API pour les développeurs, sécurité, et comparatif des principales solutions disponibles en 2026.
Pourquoi WooCommerce pour le e-commerce au Maroc
Open source et liberté totale
À la différence de Shopify ou d'autres plateformes SaaS, WooCommerce est entièrement open source. Vous possédez votre code, vos données et votre infrastructure. Pas de contrat propriété qui vous lie à un fournisseur, pas de frais additionnels sur les transactions (sauf ceux de la passerelle elle-même), et une capacité illimitée à personnaliser l'expérience d'achat.
Pour les entrepreneurs marocains qui veulent un contrôle maximal sur leur boutique - ou pour les agences web qui développent des solutions pour leurs clients - c'est un avantage déterminant.
Coût total de possession
Voici une comparaison simplifiée sur 12 mois pour une boutique de taille moyenne :
| Poste | WooCommerce | Shopify Basic |
|---|---|---|
| Plateforme | Gratuit | 348 USD (~3 600 MAD) |
| Hébergement | 3 600 - 9 600 MAD | Inclus |
| Domaine | 150 MAD | 150 MAD |
| SSL | Gratuit | Inclus |
| Thème 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 généralement plus économique dès que la boutique croît en trafic et en volume de transactions.
Écosystème WordPress au Maroc
Les développeurs WordPress sont nombreux au Maroc, ce qui facilite le recrutement ou le recours à des freelances pour les personnalisations. La documentation est disponible en français, et la communauté locale (meetups WordPress Casablanca, Rabat) est active.
Flexibilité pour les spécificités locales
WooCommerce permet d'adapter facilement la boutique au contexte marocain :
- Affichage des prix en dirham marocain (MAD)
- Prise en charge du paiement à la livraison (COD) - toujours majoritaire au Maroc
- Intégration du bon de commande pour les achats B2B
- Support multilingue français / 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, conçue spécifiquement pour le marché marocain et pensée pour les intégrateurs WooCommerce.
Points forts :
- Plugin WooCommerce officiel disponible et maintenu
- Support des cartes Visa et Mastercard marocaines et internationales
- Intégration native de Maroc Pay (paiement par QR code et portefeuille électronique)
- 3D Secure 2.0 conforme aux exigences de Bank Al-Maghrib
- Sandbox de test complet avec cartes de test documentées
- Webhook temps réel pour les mises à jour de statut de commande
- Dashboard de suivi des transactions
- Support technique en français et en arabe
- Documentation API RESTful claire pour les développeurs
Points à considérer :
- Solution plus récente que CMI, notoriété en cours de développement
- Nécessite un compte ChariBaaS actif
CMI (Centre Monétique Interbancaire)
Le CMI est l'infrastructure nationale du paiement électronique marocain, gérée par les banques. Toute carte bancaire marocaine est compatible CMI.
Points forts :
- Couverture maximale : toutes les cartes bancaires marocaines sont acceptées
- Confiance établie : les consommateurs marocains reconnaissent la marque CMI
- Certifié PCI-DSS niveau 1
Points à considérer :
- Pas de plugin WooCommerce officiel - intégration via plugins tiers ou développement custom
- Processus d'onboarding long (plusieurs semaines, documents bancaires requis)
- Interface technique plus ancienne (protocoles SHA-1 legacy sur certains endpoints)
- Support technique moins réactif pour les petites structures
- Frais de setup variables selon la banque acquéreuse
Payzone
Payzone est un agrégateur de paiement marocain qui simplifie l'accès au paiement en ligne.
Points forts :
- Plugin WooCommerce disponible
- Processus d'inscription relativement rapide
- Support des cartes marocaines et internationales
Points à considérer :
- Moins de documentation technique que Chari Pay
- Support de Maroc Pay variable selon les offres
- Frais à vérifier selon le plan
Comparatif rapide
| Critère | 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 | Compétitifs | Variables | Variables |
Guide d'installation du plugin WooCommerce pas à pas
Prérequis
Avant de commencer, assurez-vous d'avoir :
- WordPress 6.x installé avec WooCommerce 8.x ou supérieur
- Un certificat SSL actif sur votre domaine (HTTPS obligatoire)
- Un compte actif auprès de votre passerelle de paiement (Chari Pay, CMI ou Payzone)
- Vos identifiants commerçant : Merchant ID, API Key, Secret Key
Étape 1 : Configurer WooCommerce pour le Maroc
Avant d'installer le plugin de paiement, configurez WooCommerce pour le marché marocain :
- Allez dans WooCommerce > Réglages > Général
- Pays de vente : Maroc
- Devise : MAD (Moroccan Dirham)
- Position de la devise : à gauche (DH 250) ou à droite (250 DH) selon votre préférence
- Séparateur décimal : virgule (,) pour un affichage local ou point (.) selon votre audience
- Nombre de décimales : 2
Dans WooCommerce > Réglages > Livraison, configurez vos zones de livraison avec les régions marocaines (Casablanca, Rabat, Marrakech, etc.) et vos tarifs de livraison.
Étape 2 : Installer le plugin de paiement
Via le tableau de bord WordPress (recommandé)
- 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 répertoire WordPress.org :
- Téléchargez le fichier
.zipdepuis le portail développeur de votre passerelle - Allez dans Extensions > Ajouter une extension > Téléverser une extension
- Sélectionnez le fichier ZIP et cliquez sur Installer maintenant
- Cliquez sur Activer l'extension
Étape 3 : Configurer le plugin
- Allez dans WooCommerce > Réglages > Paiements
- Localisez votre passerelle dans la liste et cliquez sur Gérer
- Activer : Oui
- Titre : ce que le client verra au checkout (ex: "Paiement par carte bancaire")
- Description : courte description (ex: "Visa, Mastercard - paiement sécurisé 3D Secure")
- Mode : sélectionnez Test pour commencer
- Merchant ID : collez votre identifiant commerçant
- API Key : collez votre clé API
- Secret Key : collez votre clé secrète (pour la signature HMAC)
- URL de retour : généralement auto-configurée (
/wc-api/[nom_gateway]) - Sauvegardez
Étape 4 : Tester l'intégration en mode sandbox
Avant tout mise en production, effectuez des tests complets :
Test 1 - Paiement accepté
- Ajoutez un produit au panier
- Passez au checkout, remplissez les informations
- Utilisez la carte de test "acceptée" fournie par la passerelle
- Vérifiez que la commande passe au statut "Traitement" dans WooCommerce
- Vérifiez que l'email de confirmation est envoyé
Test 2 - Paiement refusé
- Utilisez la carte de test "refusée"
- Vérifiez que la commande reste en "En attente de paiement"
- Vérifiez le message d'erreur affiché au client
Test 3-3D Secure
- Utilisez une carte de test avec 3D Secure activé
- Vérifiez la redirection vers la page d'authentification bancaire
- Complétez l'authentification et vérifiez le retour sur WooCommerce
Test 4 - Remboursement
- Depuis WooCommerce > Commandes, ouvrez une commande test payée
- Cliquez sur Rembourser et entrez le montant
- Vérifiez que le remboursement est bien initié via le dashboard de la passerelle
Étape 5 : Basculer en mode production
Une fois tous les tests concluants :
- Dans les réglages du plugin, passez Mode de Test à Production
- Remplacez les clés API de test par les clés de production (fournies par votre passerelle)
- Effectuez une transaction réelle avec un petit montant (10 MAD)
- Vérifiez le versement sur votre compte bancaire
Intégration API personnalisée pour développeurs
Pour les boutiques avec des besoins avancés - flux de paiement sur mesure, application mobile + WooCommerce, ou intégration multi-canaux - il est possible de contourner le plugin et d'intégrer directement via l'API de la passerelle avec l'API WooCommerce.
Architecture générale
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
Créer 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 réponse inclut un payment_url vers lequel vous redirigez le client.
Traiter le webhook de confirmation
// functions.php ou plugin personnalisé
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
| Critère | CMI | Payzone | Chari Pay |
|---|---|---|---|
| Type de solution | Banque centrale | Agrégateur | 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 réel) |
| 3D Secure version | 1.0 / 2.0 | 2.0 | 2.0 |
| Délai 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% | Compétitifs |
Recommandation : pour une boutique WooCommerce qui se lance, Chari Pay offre le meilleur rapport facilité/fonctionnalités. Pour une boutique déjà établie avec un volume important et une relation bancaire forte, CMI reste une option de référence 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 dépasse 72 % selon les estimations sectorielles - un chiffre supérieur à la moyenne mondiale (70 %). Les principales causes identifiées :
- Frais de livraison découverts seulement au checkout
- Manque de confiance envers le paiement en ligne
- Processus de checkout trop long ou complexe
- Absence du paiement à la livraison (COD)
- Interface non adaptée au mobile
Stratégies concrètes
1. Afficher les frais tôt Configurez WooCommerce pour afficher une estimation des frais de livraison dès la page panier. Évitez les mauvaises surprises au dernier moment.
2. Proposer le paiement à la livraison (COD) Le COD reste le moyen de paiement dominant au Maroc, utilisé par plus de 60 % des acheteurs en ligne. Activez-le dans WooCommerce > Réglages > Paiements > Paiement à la livraison et réfléchissez à une majoration de 10-20 MAD pour inciter au paiement en ligne.
3. Ajouter Maroc Pay Le portefeuille électronique Maroc Pay cible les clients bancarisés partiellement (postes bancaires, agents) qui n'ont pas nécessairement de carte. L'ajout de ce mode de paiement via Chari Pay élargit votre base de clients potentiels.
4. Badges de confiance au checkout Affichez les logos : cadenas SSL, Visa Secure, Mastercard Identity Check, 3D Secure. Ces éléments visuels réduisent l'anxiété d'achat, particulièrement chez les nouveaux acheteurs en ligne.
5. Simplifier le formulaire checkout Utilisez un plugin de checkout one-page (ex: CheckoutWC). Supprimez les champs inutiles. Pré-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 thème WooCommerce et votre page de paiement doivent être parfaitement responsive.
7. Emails de relance de panier abandonné Installez un plugin de récupération de panier abandonné (ex: CartFlows, Abandoned Cart Lite) pour envoyer des rappels automatiques après 1h, 24h et 72h.
Sécurité et conformité PCI-DSS
Les exigences de Bank Al-Maghrib
Bank Al-Maghrib exige que tout système de paiement électronique au Maroc respecte les normes internationales de sécurité. 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 données de carte sur votre serveur
- Journalisation des transactions pour audit
PCI-DSS et le rôle de la passerelle
La bonne nouvelle : si vous utilisez une passerelle de paiement certifiée (Chari Pay, CMI, Payzone), votre boutique WooCommerce est en mode SAQ A (le niveau de conformité PCI-DSS le plus simple). Cela signifie que :
- Le formulaire de saisie de carte est hébergé par la passerelle, pas sur votre serveur
- Vos données de carte ne transitent jamais par votre infrastructure
- La responsabilité de la sécurité des numéros de carte incombe à la passerelle certifiée PCI-DSS niveau 1
Sécuriser votre WordPress/WooCommerce
Au-delà de la conformité paiement, protégez votre installation WordPress :
- Maintenez WordPress, WooCommerce et tous les plugins à jour - la majorité des compromissions exploitent des vulnérabilités connues dans des versions obsolètes
- Utilisez un plugin de sécurité (Wordfence, Sucuri) pour surveiller les tentatives d'intrusion
- Sauvegarde quotidienne de votre base de données et de vos fichiers
- Authentification à deux facteurs (2FA) pour l'accès admin WordPress
- Limitez les tentatives de connexion (plugin Limit Login Attempts)
- Désactivez 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 améliorations significatives par rapport à la version 1 :
- Authentification sans friction pour les transactions à faible risque (pas de redirection)
- Meilleure expérience mobile - authentification biométrique possible
- Partage de données enrichi avec la banque émettrice pour réduire les faux positifs
- Transfert de responsabilité en cas de fraude vers la banque émettrice (chargeback protection)
Assurez-vous que votre passerelle supporte le 3DS 2.0 et pas seulement la version 1 legacy.
Conformité avec la loi 09-08 (protection des données)
La collecte de données personnelles au checkout (nom, email, téléphone, adresse) est soumise à la loi marocaine 09-08 relative à la protection des données personnelles. Assurez-vous :
- D'afficher une politique de confidentialité claire
- D'obtenir le consentement explicite pour les communications marketing
- De vous conformer aux obligations de la CNDP (Commission Nationale de contrôle de la protection des Données à caractère Personnel)
Pour les boutiques qui traitent des volumes importants, une déclaration auprès de la CNDP peut être requise.
Comment ChariBaaS peut vous aider
Intégrer un système de paiement WooCommerce robuste au Maroc n'est pas trivial - entre les spécificités techniques, les exigences réglementaires et les attentes des consommateurs marocains, les écueils sont nombreux. ChariBaaS via Chari Pay a été conçu précisément pour simplifier ce parcours.
Ce que ChariBaaS apporte à votre boutique WooCommerce
Plugin prêt à l'emploi Notre plugin WooCommerce officiel s'installe en quelques clics et se configure en moins de 30 minutes. Pas besoin d'un développeur pour une intégration de base.
Tous les moyens de paiement marocains
- Cartes Visa et Mastercard (marocaines et internationales)
- Maroc Pay (QR code, portefeuille électronique)
- Virement bancaire (pour le B2B)
- Cash on delivery (COD) - gestion unifiée dans un seul dashboard
API RESTful moderne pour les développeurs Pour les boutiques avec des flux personnalisés, notre API REST offre une documentation claire, un SDK PHP disponible, et un environnement sandbox autonome - sans dépendre d'un interlocuteur bancaire.
Conformité intégrée 3D Secure 2.0, PCI-DSS niveau 1, chiffrement TLS 1.3 - la sécurité et la conformité sont gérées par ChariBaaS, pas par vous.
Dashboard unifié Suivez toutes vos transactions WooCommerce, vos remboursements et vos versements depuis une seule interface. Export comptable en un clic.
Versement rapide Règlement sur votre compte bancaire marocain sous J+1 ouvré (selon votre offre).
Support en français et en arabe Notre équipe technique répond en français et en arabe - pas besoin de communiquer en anglais avec un support offshore.
Prêt à intégrer 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 équipe - nous vous accompagnons étape par étape.
Voir aussi : Paiement Shopify au Maroc | Réglementation des établissements de paiement au Maroc | Portefeuille électronique et Maroc Pay
Questions fréquentes
- Quelle est la meilleure passerelle de paiement WooCommerce au Maroc ?
- Chari Pay est recommandé pour sa facilité d'intégration, 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 nécessite plus de configuration. Le choix dépend de votre volume, de vos moyens de paiement ciblés et de votre capacité 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 développés par des agences marocaines existent. L'intégration se fait généralement via redirection vers la page de paiement CMI. Pour une intégration plus robuste, l'API CMI peut être utilisée directement via WooCommerce Payment Gateway API.
- WooCommerce est-il gratuit pour vendre au Maroc ?
- WooCommerce est un plugin WordPress open source gratuit. Les coûts comprennent : hébergement (200 à 800 MAD/mois), nom de domaine (100 à 200 MAD/an), certificat SSL (gratuit avec Let's Encrypt), thème premium (optionnel), et frais de transaction de la passerelle de paiement (1,5% à 3,5%). C'est souvent moins coûteux que Shopify sur le long terme.
- Comment tester un plugin de paiement WooCommerce au Maroc sans carte réelle ?
- Activez le mode sandbox de votre passerelle de paiement (Chari Pay, CMI, Payzone) dans les paramètres du plugin WooCommerce. Chaque fournisseur fournit des numéros de carte de test, des codes CVV et des dates d'expiration permettant de simuler des paiements acceptés, refusés et des redirections 3D Secure sans débiter de vrai compte.