Notification Center — Guide complet
Installer, configurer et exploiter la cloche de notifications WooCommerce : placement, produits automatiques, codes promo, articles, annonces, multilingue et API REST.
Présentation
DataFirefly Notification Center ajoute une cloche de notifications dans l’en-tête de votre boutique WooCommerce, à côté du panier et de l’espace client. Une pastille rouge signale les nouveautés non lues et incite naturellement au clic, sans e-mail ni pop-up intrusive.
Le module diffuse automatiquement vos nouveaux produits, vos codes promo et vos articles de blog, et vous permet de publier des annonces libres depuis le tableau de bord. Il est multilingue (Polylang / WPML), compatible avec le cache de page et avec le stockage haute performance des commandes (HPOS).
En bref : une cloche et un panneau déroulant, une pastille de non-lus, et trois déclencheurs automatiques (produits, codes promo, articles) prêts à l’emploi.
Installation
- Téléversez le dossier
df-notification-centerdanswp-content/plugins/, ou installez le ZIP depuis Extensions puis Ajouter. - Activez l’extension DataFirefly Notification Center.
- Ouvrez le menu Notifications puis Réglages pour choisir l’affichage de la cloche.
WooCommerce est recommandé pour les notifications de produits et de codes promo. Les annonces manuelles et les articles de blog fonctionnent même sans WooCommerce.
Afficher la cloche
Le module propose quatre méthodes de placement, à choisir dans Réglages, Méthode d’insertion.
Les 4 méthodes
- Menu de navigation — la cloche est ajoutée à la fin d’un menu (choisissez l’emplacement de thème, en général « primary »).
- Sélecteur CSS — la cloche est insérée juste avant ou après un élément que vous désignez. Idéal pour la coller à l’icône panier.
- Cloche flottante — un bouton fixe en bas à droite ou à gauche de l’écran.
- Shortcode — placez
[df_notification_center]où vous le souhaitez.
Coller la cloche à l’icône panier
Choisissez la méthode Sélecteur CSS et indiquez le sélecteur de votre icône panier, par exemple a.cart-contents. La cloche s’insère automatiquement à côté. Le sélecteur exact dépend de votre thème : inspectez l’icône panier pour le repérer.
Apparence
Vous pouvez régler la couleur d’accent, la couleur de la pastille et de la cloche, choisir entre un simple point rouge ou un compteur chiffré, activer l’animation de la cloche en présence de non-lus, et afficher ou masquer la cloche sur mobile.
Annoncer vos contenus
Nouveaux produits (automatique)
Lorsque l’option est active, chaque produit publié crée automatiquement une notification, sans aucune action. Activez ou désactivez ce comportement dans Réglages, Produits.
Codes promo
Dans l’éditeur d’un code promo WooCommerce, une case Centre de notifications apparaît. Cochez-la pour diffuser le code, avec un message personnalisé facultatif. Le code s’affiche dans le panneau avec un bouton Copier. Si le coupon a une date d’expiration, la notification disparaît automatiquement à cette date.
Articles de blog
Dans l’éditeur d’article, une metabox Centre de notifications propose une case à cocher. Cochez-la pour annoncer l’article ; vous pouvez ajouter un message personnalisé.
Annonces manuelles
Depuis l’écran Notifications, créez des annonces libres (titre, message, lien, date d’expiration). Le tableau gère aussi l’activation, la désactivation et la suppression de toutes les notifications.
Programmation et suivi des clics
Chaque notification peut recevoir une date de fin : passée cette date, elle disparaît du panneau. Le tableau de bord affiche aussi le nombre de clics par notification, pour mesurer ce qui intéresse vos visiteurs. Un nettoyage automatique optionnel supprime les notifications inactives au-delà d’un certain nombre de jours.
Lu et non-lu
Pour les clients connectés, l’état lu/non-lu est mémorisé côté serveur et synchronisé entre leurs appareils. Pour les visiteurs non connectés, il est stocké dans le navigateur. La cloche reste donc compatible avec le cache de page : le contenu dynamique est chargé en AJAX et n’empêche pas la mise en cache.
Ouvrir le panneau marque les notifications comme lues et efface la pastille.
Multilingue (Polylang et WPML)
Quand le filtre de langue est activé, chaque notification ne s’affiche que dans sa langue d’origine : un produit publié en français n’apparaît que sur la version française du site, et ainsi de suite. Le module détecte la langue via Polylang ou WPML. Vous pouvez désactiver ce filtre pour diffuser toutes les notifications dans toutes les langues.
API REST (headless)
Un point d’accès en lecture seule expose les notifications visibles, utile pour un front headless :
GET /wp-json/df-nc/v1/notificationsLa réponse contient les notifications actives (filtrées par langue) ainsi que les identifiants déjà lus pour l’utilisateur courant.
FAQ et dépannage
La cloche ne s’affiche pas
Vérifiez la méthode d’insertion choisie. En mode Menu, assurez-vous qu’un menu est bien assigné à l’emplacement sélectionné. En mode Sélecteur CSS, vérifiez que le sélecteur correspond bien à un élément présent sur la page.
La pastille n’apparaît pas
La pastille n’apparaît que s’il existe au moins une notification active non lue. Créez une annonce de test depuis l’écran Notifications pour vérifier.
Est-ce compatible avec mon cache ?
Oui. La cloche est rendue en HTML statique et les notifications sont chargées en AJAX, ce qui reste compatible avec WP Rocket, LiteSpeed Cache et les autres systèmes de cache.
Est-ce compatible HPOS ?
Oui, le module déclare sa compatibilité avec le stockage haute performance des commandes de WooCommerce.