PrestaShop Design e Navigazione

DataFirefly SideCart — Carrello laterale per PrestaShop 8

Il carrello che non lascia più la pagina prodotto.

Addio al reindirizzamento verso /carrello che spezza l'elan d'acquisto. SideCart fa scorrere un pannello carrello dal lato dello schermo non appena un prodotto viene aggiunto. Il cliente vede ciò che ha appena aggiunto, il subtotale si aggiorna in tempo reale, e può continuare a sfogliare il tuo negozio senza ricaricare la pagina. L'UX standard dell'e-commerce moderno, in cinque minuti di installazione sul tuo PrestaShop 8.

PrestaShop 8.0+ PHP 8.0+ Senza ricaricamento 100% configurabile Mobile-first Multi-tema
  • Rimborso 30 giorni
  • 12 mesi di aggiornamenti
  • Supporto 24h
www.datafirefly.com/it/
Sidecart Prestashop 8
v1.0.0 · aggiornato 2024-12-19
Cosa fa

L' versione breve.

01

Apertura istantanea all'aggiunta

Il pannello scorre dal bordo non appena un prodotto viene aggiunto al carrello — nessun ricaricamento, nessuna perdita di contesto. Il cliente resta sulla scheda prodotto.

02

Tutto è configurabile

Posizione (sinistra / destra), colore principale, overlay scurente, auto-apertura all'aggiunta, auto-chiusura con ritardo parametrico, visualizzazione del subtotale, delle tasse e della consegna.

03

Compatibile con il tuo tema

Si collega agli hook standard di PrestaShop 8 (displayHeader, actionCartUpdateQuantityBefore, displayAfterBodyOpeningTag). Funziona con Classic, Hummingbird e la maggior parte dei temi commerciali.

04

Performance native

CSS e JS minificati e caricati solo nel front-office. Nessuna dipendenza esterna, nessun framework pesante. Impatto zero sui Core Web Vitals.

La versione lunga

Tutto quello che vorresti sapere prima di installare.

Uno sguardo dettagliato su come funziona DataFirefly SideCart — Carrello laterale per PrestaShop 8, perché l'abbiamo progettato così, e il ragionamento dietro le funzionalità qui sopra.

§ 01

Perché un carrello laterale?

Su 100 visitatori che cliccano «Aggiungi al carrello», quanti atterrano sulla pagina carrello e abbandonano? Molti. Il reindirizzamento spezza il momento in cui la voglia di acquisto è più forte. SideCart risolve questo: il cliente vede il suo carrello riempirsi senza lasciare la pagina prodotto, e può sia continuare a fare shopping, sia andare al checkout con un click. È il pattern UX standard di Amazon, Shopify e qualsiasi negozio che prenda sul serio la conversione.

§ 02

Cosa vede il cliente

Un pannello di 380 px che scorre dal lato destro (configurabile a sinistra) con un'animazione fluida. All'interno: la lista dei prodotti con immagine, nome, declinazione, prezzo unitario e controllo di quantità. In basso, il subtotale aggiornato in tempo reale, più opzionalmente l'IVA e la consegna stimata. Due pulsanti di azione: vedere il dettaglio del carrello o andare direttamente al checkout. L'overlay dietro il pannello è cliccabile per chiudere.

§ 03

Configurazione in 5 minuti

Installa lo ZIP tramite il gestore moduli PrestaShop, poi vai in Moduli → DataFirefly SideCart → Configurare. Una sola pagina di impostazioni con: Attivare / Disattivare, Posizione (Sinistra / Destra), Auto-apertura all'aggiunta (Sì / No), Overlay (Sì / No), Auto-chiusura (Sì / No) + ritardo in secondi, Colore principale (color picker) e tre caselle per visualizzare Subtotale / IVA / Consegna. Salva, è online.

§ 04

Architettura e performance

Il modulo usa gli hook nativi di PrestaShop 8 (displayHeader per gli asset, actionCartUpdateQuantityBefore per rilevare le aggiunte, displayAfterBodyOpeningTag per iniettare il pannello). Il CSS fa meno di 10 KB gzippati, il JS meno di 8 KB. Nessuna dipendenza esterna — niente jQuery richiesto, nessun framework. L'impatto sui Core Web Vitals è nullo o negativo (l'eliminazione del reindirizzamento verso /carrello migliora l'LCP percepito).

§ 05

Compatibilità multinegozio

Pienamente compatibile con PrestaShop multinegozio: ogni sotto-negozio può avere la propria configurazione (colore diverso, posizione diversa, hook attivati o no). Le variabili di configurazione vengono memorizzate tramite Configuration::updateValue con il contesto multinegozio standard.

§ 06

Mobile e accessibilità

Su mobile (< 768 px), il pannello si estende a schermo intero per una leggibilità massima. La chiusura è possibile tramite il tasto Esc, il pulsante X nell'angolo, il click sull'overlay, o lo swipe laterale (dove il device lo supporta). Tutti gli elementi interattivi hanno label ARIA e il focus viene intrappolato nel pannello quando è aperto.