Décoration Saisonnière Planifiée — Documentation
Installer et configurer Décoration Saisonnière Planifiée : créer une campagne, programmer les dates, activer effets, bannière et palette, prévisualiser en sécurité, gérer la récurrence annuelle et le multiboutique.
La Décoration Saisonnière Planifiée (module dfthemescheduler) habille automatiquement votre boutique PrestaShop pour chaque temps fort commercial. Vous créez des campagnes datées — Noël, Black Friday, soldes, Saint-Valentin — combinant bandeau, bannière, palette de couleurs, effets visuels et bloc d’accueil. Chaque campagne s’active et se retire seule aux dates programmées, sans aucune tâche planifiée.
Présentation
Le module repose sur une logique simple : une campagne est un ensemble d’éléments visuels associé à une plage de dates. Quand la date courante tombe dans cette plage, la campagne devient « live » et son habillage s’applique au front-office. En dehors, la boutique retrouve son apparence normale sans laisser de trace.
Une seule campagne est affichée à la fois. Si plusieurs campagnes se chevauchent, celle qui possède la priorité la plus élevée gagne. Vous pouvez ainsi superposer une longue campagne de Noël et un pic Black Friday plus prioritaire au milieu.
Chaque campagne peut combiner, au choix, les éléments suivants : un bandeau haut de page avec message et compte à rebours, une bannière image par langue, une palette de sept couleurs, un effet d’ambiance (neige, confettis, cœurs, feuilles, étoiles, feux d’artifice), un bloc HTML sur la page d’accueil et du CSS personnalisé. Tous ces éléments sont optionnels.
Installation
Installez le module comme n’importe quel module PrestaShop :
- Dans le back-office, allez dans Modules > Module Manager.
- Cliquez sur Envoyer un module et sélectionnez le fichier
dfthemescheduler.zip. - Une fois l’installation terminée, cliquez sur Configurer pour ouvrir le planificateur de campagnes.
Le module crée ses tables, enregistre ses hooks d’affichage et ajoute un onglet d’administration accessible via le bouton Configurer. Aucune dépendance externe n’est requise : ni Composer, ni jQuery, ni service tiers.
Si vous êtes déjà en version 1.0.0, remplacez simplement le dossier du module par la 1.1.0 : le script de mise à jour ajoute automatiquement la colonne de position de bannière et enregistre les nouveaux hooks. Aucune réinstallation n’est nécessaire.
Créer une campagne
Depuis l’écran de configuration, cliquez sur Ajouter une campagne. Le formulaire est organisé du plus important au plus optionnel.
Informations générales
- Nom de la campagne : libellé interne, par exemple « Noël 2026 » ou « Black Friday ». Il n’est jamais affiché aux visiteurs.
- Activé : interrupteur maître. Une campagne désactivée n’est jamais affichée, même à l’intérieur de sa plage de dates.
- Priorité : nombre entier. En cas de chevauchement, la campagne à la priorité la plus élevée l’emporte. Laissez 0 si vous n’avez qu’une campagne à la fois.
Dates
Les champs Date de début et Date de fin utilisent un sélecteur de date et d’heure natif, précis à la seconde. Les dates sont interprétées à l’heure du serveur de votre boutique.
Si votre navigateur affiche un champ texte au lieu du sélecteur, le format attendu est AAAA-MM-JJ HH:MM:SS, par exemple 2026-11-27 00:00:00.
Récurrence annuelle
Cochez Répéter chaque année pour qu’une campagne revienne automatiquement aux mêmes dates, année après année. Seuls le mois, le jour et l’heure sont comparés : l’année est ignorée.
Le module gère nativement les campagnes à cheval sur le Nouvel An. Une campagne du 20 décembre au 6 janvier fonctionne parfaitement et se réactive chaque hiver, sans avoir à la dédoubler.
Pour une campagne récurrente, la validation « date de fin après date de début » est volontairement désactivée, puisque la fin peut se situer sur l’année civile suivante.
Bandeau haut de page
Le champ Message du bandeau (multilingue) affiche une barre en haut de toutes les pages. Il accepte du HTML basique : liens, gras. Laissez-le vide pour masquer la barre.
Activez Afficher le compte à rebours pour ajouter un décompte en temps réel jusqu’à la date de fin de la campagne, au format « 12j 04:31:07 ». Pour une campagne récurrente, le décompte vise automatiquement la prochaine occurrence de la date de fin.
Les couleurs du bandeau (fond et texte) se règlent dans la section Palette.
Bannière image
Vous pouvez charger une bannière différente par langue, avec un lien cliquable et un texte alternatif. Les formats acceptés sont jpg, png, gif et webp. Une largeur généreuse est recommandée (par exemple 1920 × 300).
Le champ Position de la bannière détermine la zone du thème où l’image s’affiche :
- Bandeau haut — displayBanner : position par défaut, en tête de page.
- Sous l’en-tête, pleine largeur — displayNavFullWidth : juste sous le menu principal.
- Au-dessus du contenu — displayWrapperTop : au-dessus du corps de la page.
Si votre bannière ne s’affiche pas, c’est généralement que votre thème n’accroche pas le hook choisi. Essayez simplement une autre position dans la liste.
Palette de couleurs
La campagne expose sept couleurs : primaire, secondaire, liens, fond de l’en-tête, fond du pied de page, fond du bandeau et texte du bandeau.
Ces sept valeurs sont toujours exposées en variables CSS (--dfts-primary, --dfts-secondary, etc.) que votre thème ou votre CSS personnalisé peuvent réutiliser.
Activez Appliquer la palette au thème pour que le module applique lui-même ces couleurs aux boutons, liens, en-tête et pied de page. Laissez l’option désactivée si vous préférez piloter l’habillage uniquement via les variables CSS et votre propre feuille de style.
Effets visuels
Le champ Effet visuel propose six animations en JavaScript pur, dessinées sur un canvas plein écran : neige, confettis, cœurs, feuilles d’automne, étoiles scintillantes et feux d’artifice. Choisissez Aucun pour désactiver l’effet.
L’Intensité (faible, moyenne, forte) règle la densité des particules. Le nombre de particules est plafonné pour préserver les performances.
Les effets se chargent uniquement quand une campagne est active. Ils se désactivent automatiquement pour les visiteurs ayant activé la préférence « réduction de mouvement » de leur système, et se mettent en pause lorsque l’onglet n’est pas visible.
Bloc d’accueil et CSS personnalisé
Le champ Bloc page d’accueil (multilingue, éditeur visuel) affiche un contenu HTML libre sur la page d’accueil pendant toute la durée de la campagne — idéal pour une offre, un bandeau promotionnel enrichi ou un message saisonnier.
Le champ CSS personnalisé permet d’aller plus loin. Le CSS est assaini avant injection (les tentatives de sortie du conteneur de style sont neutralisées) et n’est chargé que lorsque la campagne est active. Vous pouvez y utiliser les variables --dfts-*.
Prévisualisation sécurisée
Chaque campagne dispose d’un lien de prévisualisation protégé par un jeton unique de 32 caractères. Depuis la liste des campagnes, cliquez sur le bouton Preview : la boutique s’ouvre avec l’habillage de la campagne appliqué, exactement comme le verront vos visiteurs le jour J.
L’aperçu persiste pendant votre navigation : vous pouvez parcourir toutes les pages de la boutique. Une barre fixe « Aperçu : {nom} — Quitter » s’affiche en bas à gauche ; cliquez sur Quitter pour revenir à l’affichage normal.
La prévisualisation est totalement invisible pour vos visiteurs : elle ne s’active qu’avec le lien secret contenant le bon jeton. Vous pouvez ainsi vérifier votre habillage de Noël en plein mois d’août, ou partager le lien à un client pour validation, sans rien changer pour le public.
Planificateur annuel
En tête de la liste des campagnes, le back-office affiche un tableau de bord synthétique : nombre de campagnes, campagnes actives, campagne actuellement « live » et prochaine campagne à démarrer avec le nombre de jours restants.
En dessous, une timeline sur douze mois représente chaque campagne par une barre colorée positionnée selon ses dates. Un marqueur vertical indique le jour courant, les campagnes récurrentes à cheval sur le Nouvel An sont affichées en deux segments, et chaque barre est cliquable pour ouvrir directement l’édition de la campagne.
Dupliquer, exporter, importer
Depuis la liste, l’action Dupliquer crée une copie de la campagne avec un nouveau jeton de prévisualisation, désactivée par défaut, dont les images de bannière sont physiquement recopiées — supprimer l’une n’affecte jamais l’autre. Les associations de boutique sont conservées.
Le bouton Export JSON (dans la barre d’outils) télécharge l’ensemble de vos campagnes dans un fichier. Le formulaire Import JSON du tableau de bord permet de réinjecter ce fichier sur une autre boutique. Les campagnes importées arrivent désactivées par défaut ; les images de bannière ne sont pas incluses dans l’export.
Multiboutique et multilingue
En contexte multiboutique, chaque campagne est associée aux boutiques de votre choix via la section Association boutique du formulaire. Une campagne ne s’affiche que sur les boutiques auxquelles elle est rattachée.
Le message du bandeau, la bannière (image, lien, texte alternatif) et le bloc d’accueil sont traduisibles par langue. Renseignez chaque langue depuis les onglets de langue du formulaire.
Intégration pour développeurs de thème
Quand une campagne est active, le module ajoute des classes sur la balise body : dfts-active, dfts-campaign-{id}, dfts-effect-{effet}, et dfts-preview en mode aperçu. Vous pouvez ainsi cibler finement votre CSS.
Un évènement JavaScript dfts:ready est également émis sur le document une fois le script initialisé, avec la configuration de la campagne dans son détail. Combiné aux variables CSS --dfts-*, cela permet des intégrations sur mesure sans toucher au module.
Performances
Le module est léger par conception. La résolution de la campagne active tient en une seule requête SQL mémoïsée par affichage. Le CSS et le JavaScript du front ne sont chargés que lorsqu’une campagne est réellement active. Aucun override de classe n’est utilisé : uniquement des hooks natifs PrestaShop.
Dépannage
La bannière ne s’affiche pas
Votre thème n’accroche probablement pas le hook de position choisi. Changez la Position de la bannière pour une autre valeur de la liste.
Les couleurs ne s’appliquent pas
Vérifiez que l’option Appliquer la palette au thème est activée. Si elle l’est mais que certains éléments restent inchangés, votre thème utilise des sélecteurs spécifiques : ajoutez quelques règles dans le champ CSS personnalisé en vous appuyant sur les variables --dfts-*.
L’effet ne s’anime pas
Les animations sont volontairement désactivées pour les visiteurs ayant activé la réduction de mouvement dans leur système d’exploitation, et se mettent en pause quand l’onglet est en arrière-plan. Vérifiez aussi qu’un effet autre qu’« Aucun » est sélectionné.
Deux campagnes se chevauchent
C’est le comportement attendu : une seule campagne s’affiche, celle qui a la priorité la plus élevée. Ajustez les priorités pour choisir laquelle prime.
La campagne ne se déclenche pas à l’heure prévue
Les dates sont interprétées à l’heure du serveur, qui peut différer de votre heure locale. Vérifiez le fuseau horaire de votre boutique dans les paramètres PrestaShop.