Tutto quello che vorresti sapere prima di installare.
Uno sguardo dettagliato su come funziona Modulo Carosello Marchi PrestaShop 8/9: Loghi Scorrevoli, Griglia e Muro di Loghi, perché l'abbiamo progettato così, e il ragionamento dietro le funzionalità qui sopra.
8 modi di mostrare i tuoi marchi
Il carosello fa scorrere da 1 a 3 righe di loghi con frecce, punti e scorrimento automatico. Lo scorrimento continuo fa avanzare i loghi senza sosta su 1-4 righe, con marchi diversi su ogni riga e una riga su due in senso opposto, l'effetto che si vede nelle sezioni «ci hanno scelto». Lo scorrimento verticale muove colonne di loghi verso l'alto e verso il basso. La griglia, il muro di loghi con linee sottili, il muro rotante, le pillole e l'elenco A-Z coprono gli altri usi, dalla colonna laterale alla pagina con tutti i tuoi marchi.
I marchi giusti, nell'ordine giusto
Un blocco può mostrare tutti i marchi attivi, una selezione che ordini per trascinamento, i marchi con prodotti in una categoria e nelle sue sottocategorie, oppure quelli della categoria visitata: nella pagina Scarpe compaiono solo i marchi di scarpe. Un minimo di prodotti, 1 per impostazione predefinita, esclude i marchi la cui pagina sarebbe vuota. L'ordine può essere per nome, numero di prodotti, vendite nel periodo scelto, novità o casuale. L'ordine casuale viene calcolato nel browser, quindi una cache di pagina completa continua a funzionare.
Loghi puliti, anche su sfondi colorati
PrestaShop salva i loghi dei marchi in JPG su sfondo bianco, che lascia rettangoli bianchi su una scheda grigia o una sezione scura. La scheda Loghi dei marchi permette di caricare per ogni marchio una versione trasparente in PNG, WebP o SVG, usata in tutti i blocchi. Gli SVG con script, eventi o link esterni vengono rifiutati e la cartella di caricamento è protetta. Su schede chiare, l'opzione Rimuovi gli sfondi bianchi fa sparire il bianco dei JPG senza caricare nulla. Ogni marchio può anche rimandare a una pagina a tua scelta invece che alla sua pagina PrestaShop.
Ovunque nel negozio
Ogni blocco sceglie il suo hook tra 14 posizioni comuni o un hook display digitato a mano, registrato automaticamente. Si può limitare ad alcuni tipi di pagina e ad alcuni dispositivi. Per una posizione precisa, il tag widget mostra un blocco specifico in qualsiasi template, l'hook displayDfBrandCarousel si richiama dal tema e lo shortcode [dfbrandcarousel id="3"] inserisce un blocco in una pagina CMS. I layout usano le container queries: in una colonna laterale, un blocco passa alla versione compatta senza altre impostazioni.
Un editor con anteprima dal vivo
Il back office elenca i tuoi blocchi, che puoi attivare, duplicare e riordinare per trascinamento. L'editor raggruppa le impostazioni in 5 schede (Contenuto, Layout, Stile, Animazione, Visualizzazione) e mostra accanto un'anteprima che si aggiorna a ogni modifica, in larghezza desktop, tablet o mobile. Le modalità sono presentate come schede illustrate. Un indicatore segnala le modifiche non salvate e Ctrl+S salva senza uscire dall'editor. La scheda Integrazione fornisce i codici widget, hook e shortcode di ogni blocco, pronti da copiare.
Leggero e accessibile
Il modulo non usa jQuery, né Swiper, né librerie caricate da un CDN. Il carosello si basa sullo scorrimento nativo del browser e lo scorrimento continuo sulla Web Animations API. CSS e JS vengono caricati solo nelle pagine in cui può comparire un blocco. Le animazioni si fermano quando il blocco esce dallo schermo, un pulsante pausa soddisfa il criterio WCAG 2.2.2 e i visitatori che hanno disattivato le animazioni vedono loghi fermi che possono scorrere a mano. Le copie usate per il ciclo dello scorrimento sono nascoste ai lettori di schermo ed escluse dalla navigazione da tastiera.
Ancora non ci sono recensioni.