Blog · WooCommerce

Ajouter le bouton de rétractation à WooCommerce. Trois façons, une échéance.

Environ 45 % des boutiques européennes tournent sous WordPress avec WooCommerce. Pour ces marchands, il existe trois façons réalistes d'ajouter le bouton. Les voici toutes les trois — avec le code, avec les pièges, sans marketing.

La situation de départ

À partir du 19 juin 2026, toute boutique B2C de l'UE doit disposer d'un bouton de rétractation. En France, l'obligation découle de la directive (UE) 2023/2673, transposée par l'ordonnance n° 2026-2 du 5 janvier 2026 qui modifie l'article L221-21 du Code de la consommation. Il n'y a pas de période transitoire.

Le bouton se déroule en deux étapes : „Se rétracter du contrat“ comme point d'entrée, „Confirmer la rétractation“ à la fin du formulaire. Un court formulaire entre les deux, suivi d'un accusé de réception par e-mail sur un support durable.

Façon A : balise de script dans l'en-tête

La façon la plus simple. Vous ajoutez une balise de script dans la zone d'en-tête de votre installation WordPress. Le script charge le widget, identifie votre boutique via la clé du widget et rend le bouton dans un Shadow DOM, sans entrer en conflit avec le CSS de votre thème.

Pour cela, vous modifiez le header.php de votre thème enfant. Jamais celui du thème parent, sinon l'entrée disparaît après la prochaine mise à jour.

<!-- widget/header.php, im Child-Theme -->
<?php wp_head(); ?>
<script
  src="https://widerrufbutton.net/widget/v1/wh.js"
  data-shop-id="<?php echo esc_attr(get_option('wrb_shop_id')); ?>"
  data-position="footer"
  data-lang="de"
  async
  defer
></script>

Si vous n'avez pas accès au thème, vous pouvez ajouter le même script via une extension comme „Insert Headers and Footers“. Cela fonctionne de manière identique, mais vous avez une dépendance de plus.

Façon B : filtre functions.php

Plus propre qu'une modification directe du header.php : un hook. Vous enregistrez une fonction qui délivre le script via le filtre wp_enqueue_scripts de WordPress. Avantage : votre thème reste intact et l'entrée peut être désactivée proprement.

// functions.php deines Child-Themes
add_action('wp_footer', function () {
    $shop_id = get_option('wrb_shop_id');
    if (empty($shop_id)) {
        return;
    }
    printf(
        '<script src="https://widerrufbutton.net/widget/v1/wh.js" ' .
        'data-shop-id="%s" data-position="footer" data-lang="de" async defer></script>',
        esc_attr($shop_id)
    );
}, 99);

La valeur de priorité 99 garantit que le script est chargé après tous les autres scripts du pied de page. Cela empêche les extensions de cache de le minifier trop tôt.

Façon C : extension WordPress

Pour les marchands sans bagage technique, nous travaillons sur une extension WordPress officielle. Installez-la, saisissez l'ID de la boutique, enregistrez. Le bouton apparaît dans le pied de page. L'extension chargera le script comme dans la Façon B, fournira une page de réglages dans l'admin WP et ajoutera une vérification que le domaine configuré correspond à l'installation WordPress.

Quiconque veut passer en production aujourd'hui utilise la Façon A ou B. L'extension est un confort, pas une condition préalable.

Conflits avec les page builders

Les boutiques WooCommerce tournent rarement sans surcouche. La plupart utilisent Elementor, Divi, Bricks ou WPBakery. Chacun de ces builders rend les modèles de pied de page de façon autonome et contourne parfois le flux de hooks standard.

Elementor : vérifiez si votre pied de page est un „Theme Builder Footer“. Si oui, ajoutez le widget via un élément HTML dans le pied de page Elementor, pas dans le functions.php. Sinon, Elementor le recouvre.

Divi : les Divi Theme Options comportent un champ „Code Integration“. Ajoutez-y les balises de script, dans la section „Body“.

Bricks : utilise son propre hook nommé bricks_body_end. Votre enqueue doit le viser.

Extensions de cache et de sécurité

WP Rocket, WP Super Cache, LiteSpeed Cache et Autoptimize aiment toucher aux balises de script. Ils les minifient, les combinent, les retardent ou les chargent en JavaScript. Avec le bouton de rétractation, c'est un problème, car le bouton peut apparaître trop tard ou ne pas se charger du tout.

Solution : dans les réglages de cache, excluez widerrufbutton.net de la minification et de la combinaison. Dans WP Rocket, c'est „Never delay JavaScript“. Dans LiteSpeed, „JS Excludes“. Dans Autoptimize, „Exclude scripts from Autoptimize“.

Wordfence et iThemes Security peuvent signaler comme suspectes les requêtes POST vers des domaines externes. Le widget envoie la rétractation à notre API, pas depuis votre serveur. La requête part du navigateur du client directement vers nous, il ne devrait donc pas y avoir de conflit. Si c'est tout de même le cas : ajoutez widerrufbutton.net à la liste blanche.

Vérifier que l'installation fonctionne vraiment

Ouvrez votre boutique en navigation privée. Ne faites pas défiler. Le bouton doit être visible dans la navigation ou le pied de page. Cliquez dessus. La fenêtre modale doit apparaître sans saut de défilement. Saisissez un nom de test, un e-mail de test, cliquez sur „Confirmer la rétractation“. Vous devriez recevoir un e-mail en quelques secondes.

Dans le tableau de bord WiderrufButton, la rétractation de test apparaît sous Rétractations. Supprimez ensuite l'entrée de test pour garder vos statistiques propres.

Ce que la loi exige techniquement

Le bouton doit être accessible sans défiler, ce qui en pratique signifie „above the fold“ dans la navigation ou le pied de page visible. Il doit être disponible pendant toute la durée du délai de rétractation, soit au moins quatorze jours à compter de la réception des biens. La boutique ne doit pas exiger de connexion.

L'accusé de réception doit suivre sans retard injustifié, contenir le texte intégral de la déclaration de rétractation, date et heure comprises, et être délivré sur un support durable. Un e-mail suffit. Une notification toast, non.

Tout ce qui est techniquement nécessaire derrière cela est pris en charge par le widget : validation, limitation de débit (10 requêtes par minute par IP), contre-vérification CORS face à votre domaine enregistré, envoi des e-mails, archivage longue durée avec chaîne de hachage. Plus de détails dans le guide du bouton de rétractation.

Risque de mise en demeure et prolongation du délai

Si le bouton manque, deux mécanismes s'enclenchent. Des associations de défense de la concurrence envoient des mises en demeure qui coûtent généralement de 500 à 2 000 €. Et le délai de rétractation se prolonge automatiquement à douze mois et quatorze jours. Un client peut alors se rétracter pendant une année entière.

Les deux risques sont évitables en ajoutant le bouton dès aujourd'hui.

Une balise de script, toutes les exigences

WiderrufButton fournit le processus en deux étapes, l'accusé de réception et l'archivage — depuis un seul bundle, sous les 15 Ko.

Démarrer gratuitement

14 jours gratuits · Sans carte bancaire