PS PrestaShop Principiante

Scroll Infinito PrestaShop — Guida all’installazione e alla configurazione

Installare e configurare lo scroll infinito: modalità di caricamento, paginazione che preserva la SEO, ripristino della posizione esatta e temi personalizzati.

Aggiornato Versione del modulo 1.0.0

Installazione

Scroll Infinito PrestaShop si installa come qualsiasi altro modulo PrestaShop, senza dipendenze né librerie di terze parti.

  1. Dal back-office, apri Moduli > Gestore moduli e clicca su Carica un modulo.
  2. Seleziona il file dfinfinitescroll-1.0.0.zip fornito e avvia l’installazione.
  3. Una volta installato, clicca su Configura per accedere alle impostazioni.

Il modulo non aggiunge alcuna tabella nel database e non applica alcun override. La disinstallazione non lascia tracce.

Le tre modalità di caricamento

Il comportamento di caricamento si sceglie nell’impostazione Modalità di caricamento.

Ibrida (consigliata)

Le prime pagine si caricano automaticamente durante lo scorrimento, poi subentra un pulsante «Carica altri prodotti» una volta raggiunta la soglia. È il miglior compromesso: l’esperienza resta fluida in cima alla lista, ma il visitatore mantiene il controllo e il piè di pagina torna accessibile.

Infinito puro

Tutte le pagine successive si caricano automaticamente all’avvicinarsi della fine della lista, senza pulsante. Da riservare ai cataloghi in cui l’accesso al piè di pagina non è critico.

Solo pulsante

Nessun caricamento automatico: il visitatore clicca su «Carica altri» a ogni pagina. Utile per limitare il numero di richieste o mantenere una paginazione molto esplicita.

Impostazioni disponibili

  • Modalità di caricamento — ibrida, infinito puro o solo pulsante.
  • Pagine caricate automaticamente (ibrida) — numero di pagine caricate prima che appaia il pulsante. Predefinito: 3.
  • Sincronizza URL e canonical — aggiorna la barra degli indirizzi, il tag canonical e i link rel prev/next durante lo scorrimento.
  • Ripristina la posizione esatta — reinietta le pagine già viste e riposiziona la vista sul prodotto visitato al ritorno da una scheda.
  • Attiva su tutte le pagine di elenco — categorie, produttori, fornitori, ricerca, più venduti, novità, offerte. Se disattivato, il modulo si applica solo alle categorie.
  • Etichetta del pulsante — testo multilingue del pulsante «Carica altri».
  • Selettore della lista prodotti (avanzato) e Selettore della paginazione (avanzato) — vedi la sezione sui temi personalizzati.

La paginazione resta ottimizzata per la SEO

A differenza dei moduli che sostituiscono la paginazione con una chiamata AJAX invisibile, Scroll Infinito PrestaShop si appoggia agli URL paginati nativi del tuo tema. In concreto:

  • Senza JavaScript (bot inclusi), il negozio mostra esattamente la tua consueta paginazione lato server, del tutto scansionabile.
  • Con JavaScript, il tag canonical e i link rel prev/next vengono aggiornati per riflettere la pagina realmente mostrata a schermo, in entrambe le direzioni di scorrimento.

Lascia attiva l’opzione «Sincronizza URL e canonical»: è ciò che garantisce che l’URL condiviso da un visitatore arrivato alla pagina 4 punti davvero a quella pagina.

Il ripristino della posizione esatta

È il cuore del modulo. Quando un visitatore clicca su un prodotto dopo aver scorso, il modulo salva nell’archiviazione di sessione: le pagine caricate, l’URL esatto di ciascuna, la posizione di scorrimento e l’ID del prodotto cliccato. Memorizza inoltre in cache il contenuto delle pagine, con un limite di dimensione.

Al ritorno (pulsante indietro del browser o navigazione interna dalla scheda), il modulo:

  1. reinietta all’istante le pagine dalla cache, o le riscarica in parallelo se la cache era troppo grande;
  2. riposiziona la vista con precisione sul prodotto visitato, tramite il suo ID, con ripiego sulla posizione di scorrimento.

Lo stato di ripristino scade dopo 30 minuti e non viene mai applicato in una visita diretta a un URL di tipo pagina 3: in tal caso, la pagina si comporta normalmente.

Temi personalizzati: selettori avanzati

Per impostazione predefinita, il modulo punta ai selettori del tema classic: #js-product-list .products per la lista prodotti e .pagination per il blocco di paginazione. Se il tuo tema usa una struttura diversa, compila i due campi avanzati:

  • Selettore della lista prodotti — il contenitore diretto delle schede prodotto.
  • Selettore della paginazione — il blocco che contiene il link «successivo» (rel next o classe next).

Non è necessaria alcuna modifica al codice. Il modulo riassocia i comportamenti dei prodotti iniettati tramite eventi applicativi, il che permette al tuo tema o ad altri moduli di ricollegare i loro widget alle nuove schede.

Compatibilità con la navigazione a faccette

Il modulo è compatibile con il modulo di navigazione a faccette. Ascolta l’evento di aggiornamento della lista prodotti attivato a ogni cambio di filtro, si reinizializza in modo pulito e riparte dagli URL paginati filtrati. Non è richiesta alcuna impostazione aggiuntiva.

Risoluzione dei problemi

Lo scroll infinito non si attiva

Verifica che i selettori avanzati corrispondano al tuo tema e che sulla pagina di elenco sia presente una paginazione nativa (con un link «successivo»).

Il ritorno non si riposiziona sul prodotto giusto

Assicurati che le schede prodotto del tuo tema espongano l’attributo dell’ID prodotto. Su un tema molto personalizzato che non lo espone, il modulo ripiega sulla posizione di scorrimento.

In caso di errore di rete

Il modulo ripiega automaticamente sui link di paginazione nativi: la navigazione resta sempre possibile.

Questa pagina ti è stata utile?

Ancora bloccato? Contatta l'assistenza