Decorazioni Stagionali Programmate — Documentazione

Decorazioni Stagionali Programmate (il modulo dfthemescheduler) veste automaticamente il tuo negozio PrestaShop per ogni momento commerciale chiave. Crei campagne con data — Natale, Black Friday, saldi, San Valentino — che combinano barra superiore, banner, palette di colori, effetti visivi e blocco homepage. Ogni campagna si attiva e si rimuove da sola alle date programmate, senza alcuna attività cron.

Presentazione

Il modulo si basa su un’idea semplice: una campagna è un insieme di elementi visivi associato a un intervallo di date. Quando la data corrente rientra in quell’intervallo, la campagna diventa «attiva» e il suo allestimento si applica al front-office. Al di fuori, il negozio ritrova il suo aspetto normale senza lasciare traccia.

Viene mostrata una sola campagna alla volta. Se più campagne si sovrappongono, vince quella con la priorità più alta. Così puoi sovrapporre una lunga campagna natalizia con un picco Black Friday a priorità maggiore nel mezzo.

Ogni campagna può combinare, a scelta, i seguenti elementi: una barra superiore con messaggio e conto alla rovescia, un’immagine di banner per lingua, una palette di sette colori, un effetto d’atmosfera (neve, coriandoli, cuori, foglie, stelle, fuochi d’artificio), un blocco HTML in homepage e CSS personalizzato. Tutti gli elementi sono opzionali.

Installazione

Installa il modulo come qualsiasi modulo PrestaShop:

1. Nel back office, vai su Moduli > Gestore moduli.
2. Clicca su Carica un modulo e seleziona il file dfthemescheduler.zip.
3. Una volta installato, clicca su Configura per aprire il pianificatore di campagne.

Il modulo crea le sue tabelle, registra i suoi hook di visualizzazione e aggiunge una scheda di amministrazione accessibile tramite il pulsante Configura. Non richiede alcuna dipendenza esterna: né Composer, né jQuery, né servizi di terze parti.

Creare una campagna

Dalla schermata di configurazione, clicca su Aggiungi una campagna. Il modulo è organizzato dal più importante al più opzionale.

Informazioni generali

• Nome della campagna: etichetta interna, ad esempio «Natale 2026» o «Black Friday». Non viene mai mostrata ai visitatori.
• Attivato: interruttore principale. Una campagna disattivata non viene mai mostrata, nemmeno all’interno del suo intervallo di date.
• Priorità: numero intero. In caso di sovrapposizione, vince la priorità più alta. Lascia 0 se hai una sola campagna alla volta.

Date

I campi Data di inizio e Data di fine usano un selettore di data e ora nativo, preciso al secondo. Le date sono interpretate nell’ora del server del tuo negozio.

Ricorrenza annuale

Spunta Ripeti ogni anno affinché una campagna torni automaticamente alle stesse date, anno dopo anno. Vengono confrontati solo il mese, il giorno e l’ora: l’anno è ignorato.

Il modulo gestisce nativamente le campagne a cavallo del Capodanno. Una campagna dal 20 dicembre al 6 gennaio funziona perfettamente e si riattiva ogni inverno, senza doverla duplicare.

Barra superiore

Il campo Messaggio della barra (multilingua) mostra una barra in cima a tutte le pagine. Accetta HTML di base: link, grassetto. Lascialo vuoto per nascondere la barra.

Attiva Mostra conto alla rovescia per aggiungere un conteggio in tempo reale fino alla data di fine della campagna, nel formato «12g 04:31:07». Per una campagna ricorrente, il conto alla rovescia punta automaticamente alla prossima occorrenza della data di fine.

I colori della barra (sfondo e testo) si impostano nella sezione Palette.

Immagine di banner

Puoi caricare un banner diverso per lingua, con un link cliccabile e un testo alternativo. I formati accettati sono jpg, png, gif e webp. Si consiglia una larghezza generosa (ad esempio 1920 × 300).

Il campo Posizione del banner determina la zona del tema in cui appare l’immagine:

• Striscia superiore — displayBanner: posizione predefinita, in cima alla pagina.
• Sotto l’header, a tutta larghezza — displayNavFullWidth: subito sotto il menu principale.
• Sopra il contenuto — displayWrapperTop: sopra il corpo della pagina.

Palette di colori

Una campagna espone sette colori: primario, secondario, link, sfondo dell’header, sfondo del footer, sfondo della barra e testo della barra.

Questi sette valori sono sempre esposti come variabili CSS (--dfts-primary, --dfts-secondary, ecc.) che il tuo tema o il tuo CSS personalizzato possono riutilizzare.

Attiva Applica la palette al tema affinché il modulo applichi da sé questi colori a pulsanti, link, header e footer. Lascia l’opzione disattivata se preferisci gestire l’allestimento unicamente tramite le variabili CSS e il tuo foglio di stile.

Effetti visivi

Il campo Effetto visivo offre sei animazioni in JavaScript puro, disegnate su un canvas a schermo intero: neve, coriandoli, cuori, foglie autunnali, stelle scintillanti e fuochi d’artificio. Scegli Nessuno per disattivare l’effetto.

L’Intensità (bassa, media, alta) regola la densità delle particelle. Il numero di particelle è limitato per preservare le prestazioni.

Gli effetti si caricano solo quando una campagna è attiva. Si disattivano automaticamente per i visitatori che hanno attivato la preferenza «movimento ridotto» del loro sistema, e si mettono in pausa quando la scheda non è visibile.

Blocco homepage e CSS personalizzato

Il campo Blocco homepage (multilingua, editor visuale) mostra un contenuto HTML libero sulla pagina iniziale per tutta la durata della campagna — ideale per un’offerta, un banner promozionale arricchito o un messaggio stagionale.

Il campo CSS personalizzato permette di andare oltre. Il CSS viene sanificato prima dell’iniezione (i tentativi di uscire dal contenitore di stile sono neutralizzati) e viene caricato solo quando la campagna è attiva. Puoi usarvi le variabili --dfts-*.

Anteprima sicura

Ogni campagna dispone di un link di anteprima protetto da un token unico di 32 caratteri. Dall’elenco delle campagne, clicca sul pulsante Preview: il negozio si apre con l’allestimento della campagna applicato, esattamente come lo vedranno i tuoi visitatori il giorno del lancio.

L’anteprima persiste durante la navigazione: puoi percorrere tutte le pagine del negozio. Una barra fissa «Anteprima: {nome} — Esci» appare in basso a sinistra; clicca su Esci per tornare alla visualizzazione normale.

Pianificatore annuale

In cima all’elenco delle campagne, il back office mostra un cruscotto riepilogativo: numero di campagne, campagne attive, campagna attualmente «attiva» e prossima campagna in partenza con il numero di giorni rimanenti.

Sotto, una timeline di dodici mesi rappresenta ogni campagna con una barra colorata posizionata secondo le sue date. Un indicatore verticale segna il giorno corrente, le campagne ricorrenti a cavallo del Capodanno sono mostrate in due segmenti, e ogni barra è cliccabile per aprire direttamente la modifica della campagna.

Duplicare, esportare, importare

Dall’elenco, l’azione Duplica crea una copia della campagna con un nuovo token di anteprima, disattivata per impostazione predefinita, le cui immagini di banner vengono copiate fisicamente — eliminarne una non influisce mai sull’altra. Le associazioni di negozio sono conservate.

Il pulsante Esporta JSON (nella barra degli strumenti) scarica tutte le tue campagne in un file. Il modulo Importa JSON del cruscotto permette di reiniettare quel file in un altro negozio. Le campagne importate arrivano disattivate per impostazione predefinita; le immagini di banner non sono incluse nell’esportazione.

Multinegozio e multilingua

In un contesto multinegozio, ogni campagna è associata ai negozi che scegli tramite la sezione Associazione negozio del modulo. Una campagna viene mostrata solo nei negozi a cui è collegata.

Il messaggio della barra, il banner (immagine, link, testo alternativo) e il blocco homepage sono traducibili per lingua. Compila ogni lingua dalle schede lingua del modulo.

Integrazione per sviluppatori di temi

Quando una campagna è attiva, il modulo aggiunge classi sul tag body: dfts-active, dfts-campaign-{id}, dfts-effect-{effetto}, e dfts-preview in modalità anteprima. Puoi così mirare il tuo CSS con precisione.

Viene inoltre emesso un evento JavaScript dfts:ready sul document una volta inizializzato lo script, con la configurazione della campagna nel suo dettaglio. Combinato con le variabili CSS --dfts-*, ciò consente integrazioni su misura senza toccare il modulo.

Prestazioni

Il modulo è leggero per progettazione. Risolvere la campagna attiva richiede una sola query SQL memoizzata per visualizzazione. Il CSS e il JavaScript del front vengono caricati solo quando una campagna è realmente attiva. Non viene usato alcun override di classe: solo hook nativi PrestaShop.

Risoluzione dei problemi

Il banner non appare

Il tuo tema probabilmente non implementa l’hook di posizione scelto. Cambia la Posizione del banner con un altro valore dell’elenco.

I colori non si applicano

Verifica che l’opzione Applica la palette al tema sia attivata. Se lo è ma alcuni elementi restano invariati, il tuo tema usa selettori specifici: aggiungi alcune regole nel campo CSS personalizzato, appoggiandoti alle variabili --dfts-*.

L’effetto non si anima

Le animazioni sono volutamente disattivate per i visitatori che hanno attivato il movimento ridotto nel loro sistema operativo, e si mettono in pausa quando la scheda è in secondo piano. Verifica anche che sia selezionato un effetto diverso da «Nessuno».

Due campagne si sovrappongono

È il comportamento previsto: viene mostrata una sola campagna, quella con la priorità più alta. Regola le priorità per scegliere quale prevale.

La campagna non si attiva all’ora prevista

Le date sono interpretate nell’ora del server, che può differire dalla tua ora locale. Verifica il fuso orario del tuo negozio nelle impostazioni di PrestaShop.