Come (e perché) aggiungere lo scorrimento infinito ai siti web dei clienti
Quando state progettando siti WordPress per i vostri clienti, l’usabilità è un fattore importante da considerare. Tuttavia, alcune delle tecniche utilizzate per migliorare la User Experience (UX) su un sito, potrebbero non essere i metodi migliori per un altro.
Lo scorrimento infinito è una tattica che sviluppatori e designer utilizzano per mantenere i visitatori del sito impegnati. Mentre alcuni sostengono che può effettivamente danneggiare l’usabilità dei siti web, ci sono molti casi in cui può essere vantaggioso.
In questo post, spiegheremo cos’è lo scorrimento infinito e quali tipi di siti possono beneficiarne. Poi ti guideremo attraverso tre metodi che puoi usare per aggiungere questa funzionalità ai siti dei tuoi clienti. Iniziamo!
Un’introduzione allo scorrimento infinito
Lo scorrimento infinito è una tecnica di web design in cui il nuovo contenuto viene caricato automaticamente quando un visitatore raggiunge il fondo della pagina. Il risultato è un costante, apparentemente infinito feed di contenuti.
Esempi popolari di siti che usano lo scorrimento infinito sono i social network come Facebook, Twitter e Pinterest. Si può anche vedere su siti di blogging e di intrattenimento come Mashable e Buzzfeed:
Ci sono molti benefici nell’incorporare lo scorrimento infinito su questi siti web. Più ovviamente, si risparmia tempo e fornisce ai vostri utenti più contenuti senza la necessità di fare clic su un pulsante Read More o link di paginazione.
Con meno distrazioni, l’alimentazione automatica del contenuto può anche significare che gli utenti rimangono più a lungo, il che può tradursi in tassi di coinvolgimento più elevati. Inoltre, questa funzione è mobile-friendly.
Tuttavia, non tutti i siti web sono adatti allo scorrimento infinito. Per esempio, se avete un sito web orientato all’obiettivo, come un negozio di e-commerce, può rendere difficile per gli utenti trovare quello che stanno cercando. Può anche avere un impatto sulle prestazioni del sito se non è ottimizzato correttamente.
D’altra parte, se hai un sito con una struttura lineare, può essere molto vantaggioso. Lo scorrimento infinito può essere particolarmente utile per scopi narrativi, sia attraverso post di blog di lunga durata che contenuti visivi come le immagini.
Come aggiungere lo scorrimento infinito ai siti web dei clienti (3 metodi)
Se stai creando siti web dei clienti che sono orientati al contenuto, potresti considerare l’aggiunta di una funzione di scorrimento infinito. Diamo un’occhiata a tre metodi che puoi usare per farlo.
Utilizzare un plugin per lo scorrimento infinito
Uno dei metodi più facili e veloci che puoi usare per aggiungere lo scorrimento infinito ai siti dei tuoi clienti è quello di usare un plugin. Alcuni, come Jetpack, includono funzioni per implementare questo elemento di design.
Non ci sono molti plugin standalone per lo scorrimento infinito. Tuttavia, uno popolare che consigliamo di utilizzare è Ajax Load More:
Questo plugin è gratuito e facile da usare, anche se richiede alcune conoscenze di programmazione. Consente di aggiungere lo scorrimento infinito per il caricamento pigro di post, pagine e commenti.
Dopo aver installato e attivato il plugin, è possibile configurare i parametri di query WordPress pertinenti in base ai vari tipi di contenuto. Nella pagina delle impostazioni, è possibile regolare e personalizzare il comportamento di Ajax Load More sui siti web dei clienti. Per esempio, puoi aggiungere il tuo CSS personalizzato:
Il plugin include anche uno Shortcode Builder che puoi usare per modificare rapidamente pagine e post dal tuo editor di contenuti o dai tuoi file template. Un’altra caratteristica del plugin che vale la pena di controllare è il suo Repeater Templates:
Puoi creare il tuo template ripetitore e regolare come l’HTML e il PHP funzionano all’interno dello shortcode. Puoi anche includere più istanze del plugin Ajax Load More su un singolo post, pagina o template.
Mentre il plugin gratuito fornisce un sacco di funzioni per lo scorrimento infinito, c’è anche una versione premium che sblocca l’accesso a più modelli. Per saperne di più, puoi controllare la documentazione e la pagina di supporto di Ajax Load More.
Scegliete i temi con lo scorrimento infinito incorporato
Se non volete aggiungere un altro plugin ai vostri siti clienti, non preoccupatevi. Puoi ottenere lo stesso effetto usando un tema che ha lo scroll infinito incorporato.
Ovviamente, questa strada non è la più pratica per i siti esistenti. Cambiare il tema di un sito spesso richiede un ampio rebranding. Questo non vale esattamente la pena solo per ottenere l’accesso a una funzione di scorrimento infinito – soprattutto considerando che è possibile ottenerlo con altri metodi.
C’è un buon numero di temi WordPress che includono questa funzionalità. È possibile sfogliare la Directory dei temi WordPress e cercare per la funzione di scorrimento infinito:
Mentre il tema stesso può essere gratuito, tieni presente che potrebbe essere necessario eseguire l’aggiornamento alla versione premium per utilizzare lo scorrimento infinito. Tuttavia, ci sono alcuni che offrono la funzionalità a costo zero, come Minimal Dark.
Una volta trovato un tema che ti piace che include la funzione, scaricalo e installalo come faresti con qualsiasi altro tema. La maggior parte includerà la funzione nel Theme Customizer.
Per esempio, con Minimal Dark, puoi trovare l’opzione di scorrimento infinito andando su Aspetto > Personalizza > Opzioni del tema > Opzioni di paginazione:
Se vuoi caratteristiche più avanzate, potresti considerare un tema premium. Theme Forest ha una vasta selezione che include lo scorrimento infinito.
Le indicazioni per attivare e utilizzare la funzione di scorrimento infinito dipenderà dal tema che stai usando. Pertanto, è meglio controllare la documentazione dello sviluppatore per una guida.
Aggiungi manualmente il codice al tuo sito
Un terzo metodo per implementare lo scorrimento infinito – e uno che può essere preferito se sei uno sviluppatore esperto – è quello di aggiungere manualmente il codice al tuo sito. Questa opzione ti dà più controllo ed elimina la necessità di installare un plugin aggiuntivo.
Inoltre, è possibile utilizzare questo codice su siti con temi che non sono dotati di scorrimento infinito integrato. Il primo passo è quello di attivare la funzione attraverso il file functions.php del vostro tema.
Per fare questo, aggiungere il seguente codice al file:
Una volta che questo è completo, il passo successivo è quello di impostare la funzione Render Parameter. Questa è la parte del codice che si occupa di caricare i post per lo scorrimento infinito in un ciclo.
Per fare in modo che i post vengano caricati continuamente, aggiungete la funzione mytheme_infite_scroll_init
al file functions.php del vostro tema così:
function mytheme_infinite_scroll_render(){get_template_part( 'loop' );}
Una volta aggiunti questi due snippet, dovreste essere a posto. Tuttavia, se non funziona, potresti dover cambiare il tema del sito. I prodotti più vecchi e superati potrebbero non supportare affatto lo scorrimento infinito.
Conclusione
Lo scorrimento infinito non è per tutti. Tuttavia, ci sono alcuni siti web, come i blog e altre pubblicazioni online ricche di contenuti, dove può fornire una migliore UX e persino aumentare il coinvolgimento.
In questo articolo, abbiamo discusso tre metodi che puoi usare per aggiungere lo scorrimento infinito ai siti web dei tuoi clienti:
- Utilizzare un plugin per lo scorrimento infinito.
- Scegliere temi con scorrimento infinito incorporato.
- Aggiungi manualmente del codice al tuo sito.