DF Swipe Gallery — Navigazione prodotti tramite swipe

Panoramica

DF Swipe Gallery trasforma le pagine categoria del vostro negozio PrestaShop in un mazzo di card a schermo intero in stile Tinder. Il visitatore scopre i prodotti uno alla volta: swipe a destra per il like (wishlist), a sinistra per saltare, verso l’alto per aggiungere al carrello. Una barra di avanzamento stile stories indica la posizione e una schermata finale riepiloga i preferiti della sessione. Ogni interazione alimenta una dashboard analytics nel back office.

Installazione

1. Nel back office, aprite Moduli → Gestore dei moduli → Carica un modulo.
2. Caricate il file dfswipegallery.zip e fate clic su Installa.
3. Il modulo crea automaticamente le sue due tabelle (df_swipegallery_like e df_swipegallery_stat), registra i suoi hook e aggiunge la scheda Catalogo → Swipe Gallery.

Non serve alcuna modifica al tema: il pulsante di avvio e l’overlay vengono iniettati tramite l’hook displayFooterAfter, indipendentemente dal vostro template.

Configurazione

Aprite Moduli → DF Swipe Gallery → Configura. Opzioni disponibili:

• Enable swipe gallery — attiva o disattiva il modulo globalmente.
• Mobile devices only — limita il pulsante flottante agli schermi sotto i 992 px (attivo per impostazione predefinita). Disattivatelo per offrire il mazzo anche su desktop.
• Maximum products per deck — card per sessione, da 5 a 100 (30 per impostazione predefinita).
• Deck order — ordine delle card: posizione categoria, casuale (consigliato per la scoperta) o novità prima.
• Swipe up adds to cart — attiva il super-like: uno swipe verso l’alto aggiunge il prodotto al carrello.
• Hide already liked products — esclude dai nuovi mazzi i prodotti già apprezzati dal visitatore.
• Show price on cards — mostra o nasconde il prezzo sulle card (nascosto automaticamente in modalità catalogo).
• Launcher button position — posizione del pulsante flottante: basso a destra, basso a sinistra o basso al centro.

Utilizzo nel negozio

Su ogni pagina categoria appare un pulsante flottante «Swipe mode». Al tocco, il mazzo si apre a schermo intero:

• Swipe a destra (o pulsante cuore) — like: il prodotto viene salvato nella wishlist.
• Swipe a sinistra (o pulsante croce) — passa al prodotto successivo.
• Swipe verso l’alto (o pulsante carrello) — aggiunge il prodotto al carrello.
• Tocco su «Vedi il prodotto» — apre la scheda prodotto.

Su desktop, le frecce della tastiera replicano i gesti (→ like, ← salta, ↑ carrello) e il tasto Esc chiude il mazzo. Un feedback aptico accompagna ogni swipe sui dispositivi compatibili, e l’animazione viene disattivata se il visitatore ha attivato prefers-reduced-motion.

Alla fine del mazzo, una schermata riepilogativa elenca i prodotti apprezzati con il prezzo e un link diretto a ogni scheda, più un pulsante per rilanciare una sessione.

Wishlist, clienti e ospiti

Ogni like viene salvato nella tabella dedicata del modulo, sia che provenga da un cliente connesso sia da un visitatore ospite (collegato al suo id_guest). Una chiave univoca impedisce i duplicati.

Se il modulo ufficiale blockwishlist è installato e il cliente è connesso, il prodotto viene aggiunto anche alla sua lista dei desideri predefinita — creata automaticamente se non esiste ancora. Non serve alcuna configurazione: il ponte è silenzioso e non fallisce mai in modo rumoroso.

Aggiunta al carrello con swipe

Lo swipe verso l’alto aggiunge il prodotto lato server: il carrello viene creato se necessario, la quantità minima del prodotto viene rispettata e il badge carrello del tema viene aggiornato tramite l’evento standard prestashop.emit('updateCart'). I prodotti non ordinabili vengono rifiutati in modo pulito con un messaggio.

Analytics nel back office

La scheda Catalogo → Swipe Gallery mostra la dashboard:

• Contatori globali: card viste, like, skip, aggiunte al carrello.
• Tasso di like globale: like / (like + skip).
• Top 20 dei prodotti per like, con visualizzazioni, skip, carrelli e tasso di like per prodotto.

Questi dati sono un segnale di merchandising diretto: i prodotti con un alto tasso di like meritano più visibilità, quelli molto saltati forse necessitano di una foto migliore o di un riposizionamento. Le statistiche di un prodotto eliminato vengono eliminate automaticamente.

Multinegozio e multilingue

I like e le statistiche vengono registrati per negozio (id_shop). I testi del mazzo (Like, Salta, Vedi il prodotto, schermata riepilogativa…) passano dal sistema di traduzione nativo di PrestaShop: traduceteli in Internazionale → Traduzioni → Traduzioni dei moduli installati.

Risoluzione dei problemi

• Il pulsante non appare — verificate che il modulo sia attivo, che vi troviate su una pagina categoria e che l’opzione solo-mobile non sia attiva se state testando su desktop.
• Il mazzo è vuoto — la categoria non contiene alcun prodotto attivo visibile, oppure tutti i prodotti sono esclusi dall’opzione «Hide already liked products».
• Il badge carrello non si aggiorna — il vostro tema personalizzato potrebbe non ascoltare l’evento updateCart; adattate il listener nel tema o contattate il supporto.
• Conflitto di visualizzazione — l’overlay usa uno z-index di 1060; aumentatelo via CSS se un elemento del tema si sovrappone.

Changelog

• 1.0.0 (2026-07-16) — Versione iniziale: mazzo swipe a schermo intero, wishlist con swipe a destra e ponte blockwishlist, aggiunta al carrello con swipe verso l’alto, supporto degli ospiti, dashboard analytics, barra di avanzamento stile stories, accessibilità, compatibilità con PrestaShop 8 e 9 e multinegozio.