Sostituire il Pulsante Aggiungi al Carrello negli Elenchi PrestaShop: installazione e configurazione
Installare il modulo, creare regole per categoria, prodotto o combinazione, impostare il pulsante e il prezzo «Da», adattare i selettori al tema.
Presentazione
Il modulo sostituisce il pulsante Aggiungi al carrello delle miniature prodotto (pagine categoria, ricerca, home, caroselli, prodotti correlati) con un pulsante che porta alla scheda prodotto. Lì il cliente sceglie peso, taglia o formato prima di aggiungere al carrello. Definite delle regole: quali prodotti sono interessati, quale testo mostra il pulsante e se il prezzo più basso delle combinazioni viene mostrato con «Da».
Installazione
- In Moduli > Gestione moduli, cliccate su Carica un modulo e inviate il file
dflistingbutton-1.0.0.zip. - Il modulo crea le tabelle
ps_dflb_rule,ps_dflb_rule_lang,ps_dflb_rule_shop,ps_dflb_rule_categoryeps_dflb_rule_product, e aggiunge il menu Catalogo > Pulsanti elenchi prodotti. - Viene creata una regola di esempio disattivata, «Esempio: tutti i prodotti con combinazioni». Potete attivarla così com’è o eliminarla.
- Dopo aver creato o attivato una regola, aprite una pagina categoria del negozio. Se il pulsante non compare, svuotate la cache in Parametri avanzati > Prestazioni.
Creare una regola
In Catalogo > Pulsanti elenchi prodotti, cliccate su Aggiungi una regola. Il modulo ha tre blocchi.
Regola e destinazione
- Nome della regola: nome interno, non visibile ai clienti.
- Attiva: una regola disattivata viene ignorata.
- Priorità: quando più regole corrispondono a un prodotto, vince quella con il numero più basso. Valore predefinito: 10.
- Si applica a: Tutti i prodotti, Categorie o Prodotti specifici.
- Categorie: albero di caselle con campo filtro. Per questo tipo di regola è obbligatoria almeno una categoria.
- Includi sottocategorie: sono inclusi anche i prodotti di tutte le sottocategorie delle categorie selezionate.
- Corrispondenza di categoria: Il prodotto è in una delle categorie (contano tutte le categorie associate al prodotto) o Solo la categoria predefinita del prodotto.
- Prodotti: per il tipo Prodotti specifici, ricerca per nome, riferimento o ID.
- Condizione: Nessuna condizione, Prodotti con combinazioni o Prodotti che usano un gruppo di attributi. Con Prodotti con combinazioni, i prodotti semplici della stessa categoria mantengono il pulsante Aggiungi al carrello.
- Gruppo di attributi: per l’ultima condizione, ad esempio Peso o Taglia. Sono interessati solo i prodotti con una combinazione che usa questo gruppo.
- Prodotti esclusi: questi prodotti non ricevono mai il pulsante di questa regola, qualunque sia la destinazione.
- Associazione negozio: in multinegozio, scegliete i negozi in cui si applica la regola.
Pulsante
- Testo del pulsante: un testo per lingua, ad esempio «Vedi tutti i pesi disponibili». Una lingua lasciata vuota riprende il primo testo inserito.
- Stile: Pulsante principale del tema (classi
btn btn-primary), Pulsante con bordo del tema (btn btn-outline-primary) o Colori personalizzati, con colore di sfondo, colore del testo e anteprima. - Icona: freccia, opzioni, bilancia, occhio o nessuna.
- Larghezza piena: il pulsante occupa tutta la larghezza della miniatura.
- Classi CSS aggiuntive: aggiunte al pulsante, utili per riprendere una classe del tema.
- Nascondi il selettore di quantità: nasconde il campo quantità che alcuni temi mostrano negli elenchi.
Prezzo negli elenchi
Questo blocco riguarda solo i prodotti con almeno due combinazioni.
- Mostra il prezzo più basso delle combinazioni: PrestaShop calcola il prezzo di ogni combinazione (imposte, gruppo del cliente, prezzi specifici e sconti compresi). Se il più basso differisce dal prezzo mostrato dal tema, lo sostituisce, e il prezzo precedente barrato e l’etichetta di sconto della miniatura vengono nascosti.
- Aggiungi il prefisso «Da»: aggiunto davanti al prezzo solo se i prezzi delle combinazioni sono diversi e il prezzo mostrato è il più basso. Se disattivate l’opzione precedente e la combinazione predefinita non è la meno cara, il prefisso non viene mostrato, per non annunciare un prezzo errato.
- Testo del prefisso: un testo per lingua («Da», «From», «Desde» ecc.).
Esempio: formaggi e salumi venduti a peso
- Nome: Formaggi a peso. Si applica a: Categorie. Selezionate Formaggi e salumi e mantenete Includi sottocategorie.
- Condizione: Prodotti che usano un gruppo di attributi, gruppo Peso.
- Testo del pulsante: «Vedi tutti i pesi disponibili» in italiano, «Ver todas las opciones de peso» in spagnolo.
- Mantenete attivi Mostra il prezzo più basso e Da, poi salvate.
Nella categoria, ogni formaggio venduto da 250 g, 500 g e 1 kg mostra «Da» seguito dal prezzo del 250 g e il pulsante verso la sua scheda. Un prodotto venduto a pezzo, senza combinazione di peso, mantiene il pulsante Aggiungi al carrello.
Impostazioni generali
La pagina di configurazione del modulo (pulsante Impostazioni sopra l’elenco delle regole) contiene:
- Attiva il modulo: disattiva tutte le regole senza eliminarle.
- Rilevamento del tema: Automatico (consigliato), Usa sempre la ricerca AJAX o Solo hook. Vedi la sezione successiva.
- Disattiva anche il link nativo di aggiunta al carrello: svuota lato server l’URL di aggiunta al carrello dei prodotti interessati, tramite l’hook
actionPresentProductListing. Alcuni temi mostrano allora un proprio link «Vedi prodotto»: se ottenete due pulsanti, lasciate questa opzione disattivata. - Nascondi il pulsante Anteprima rapida: solo sui prodotti interessati.
- Ignora le combinazioni esaurite per il prezzo più basso: si applica quando la gestione delle scorte è attiva e il prodotto non accetta ordini senza disponibilità. Se tutte le combinazioni sono esaurite, vengono considerate tutte.
Compatibilità con il tema
Come il modulo individua i prodotti
Durante la visualizzazione di una miniatura, il modulo viene eseguito negli hook displayProductPriceBlock e displayProductListReviews, richiamati dal tema Classic, da Hummingbird e dalla maggior parte dei temi. Per ogni prodotto interessato stampa un segnaposto invisibile. Lo script del modulo trova la miniatura che contiene il segnaposto, nasconde il pulsante carrello, il modulo di aggiunta al carrello che lo contiene e il selettore di quantità, poi inserisce il nuovo pulsante al posto di quello nascosto.
Se il tema non mostra alcun pulsante carrello negli elenchi (caso del tema Classic), il pulsante viene inserito subito dopo il blocco prezzo.
In modalità Automatico, se nessuna miniatura della pagina ha attivato questi hook, lo script invia gli ID dei prodotti visibili al controller del modulo, che restituisce quelli interessati (al massimo 60 prodotti per richiesta, solo prodotti attivi e visibili). Le miniature aggiunte dopo un filtro a faccette, un ordinamento o uno scroll infinito vengono gestite automaticamente.
Selettori CSS
Il blocco Compatibilità tema (selettori CSS) della configurazione contiene i selettori usati dallo script:
- Contenitore della miniatura prodotto: blocco che racchiude un prodotto (
.product-miniature,.ajax_block_productecc.). - Pulsante Aggiungi al carrello: elementi sostituiti (
.add-to-cart,[data-button-action="add-to-cart"]ecc.). - Selettore di quantità, Prezzo, Prezzo precedente e sconto, Punto di inserimento, Pulsante Anteprima rapida.
Aggiungete le classi del vostro tema all’elenco, separate da virgole. Il pulsante Ripristina i selettori predefiniti riporta i valori originali.
Personalizzare lo stile
Il pulsante ha la classe .dflb-btn, più .dflb-full a larghezza piena e .dflb-style-custom con colori personalizzati (variabili --dflb-bg e --dflb-color). Il prefisso del prezzo ha la classe .dflb-from, e la miniatura elaborata riceve .dflb-has-btn.
Con un tema molto personalizzato, provate su una copia del negozio: pagina categoria, ricerca, home e filtri a faccette.
Cosa non modifica il modulo
- il prodotto principale della scheda prodotto e la sua anteprima rapida;
- il carrello, il processo d’ordine e l’account cliente;
- i file del core e del tema (nessun override, nessun template modificato).
Limiti noti
- Il modulo cambia la visualizzazione degli elenchi. Non blocca un’aggiunta al carrello fatta in altro modo (link diretto, modulo di terze parti).
- Il prezzo più basso e il prefisso vengono applicati nel browser. L’HTML originale e i dati strutturati del tema mantengono il prezzo della combinazione predefinita.
- Oltre 150 combinazioni su uno stesso prodotto, solo le prime 150 servono al calcolo del prezzo più basso.