Il blocco Query Loop di WordPress ha già un pannello Filtri, ma nessuno di questi è pensato per i tuoi visitatori.
Quelle tassonomie, autori e opzioni di parole chiave si trovano nelle impostazioni del blocco dell'editor, dove decidono quali post vengono mostrati dal loop prima che chiunque carichi la pagina.
Ciò significa che un blog di viaggi con una griglia di 60 post mostra gli stessi 60 post a ogni lettore. Qualcuno che pianifica un viaggio in Portogallo deve ancora scorrere tutte le guide del Giappone e del Messico per trovare quella per cui è venuto.
Per aggiungere filtri al blocco Query Loop di WordPress che i visitatori possono cliccare, è necessario aggiungere codice personalizzato o assumere uno sviluppatore. Ma un plugin come WPFilters posiziona un filtro per categoria accanto al tuo Query Loop, aggiorna i risultati senza ricaricare la pagina e ti fornisce un link filtrato che puoi condividere.
In questo articolo, ti mostreremo come aggiungere filtri al blocco Query Loop di WordPress senza scrivere codice.
Perché i filtri integrati del blocco Query Loop non sono sufficienti
Il blocco Query Loop visualizza un elenco dinamico di post, pagine o altri contenuti su qualsiasi pagina o modello.
Decidi cosa va in quell'elenco dalle impostazioni del blocco, inclusi il tipo di post, l'ordine e quanti post appaiono per pagina.
Il pannello Filtri del blocco Query Loop restringe ulteriormente quell'elenco per categoria, tag, autore o parola chiave.
Fai queste scelte mentre modifichi la pagina e i visitatori vedono solo il risultato.
Non c'è una casella di controllo o un menu a discesa sul front-end che permetta a un lettore di cambiare ciò che mostra il loop.
I filtri per visitatori mettono quelle caselle di controllo e menu a discesa sul front-end, in modo che i lettori possano restringere il loop da soli.
Perché aggiungere filtri per visitatori a un Query Loop?
Abbiamo notato che una lunga griglia di Query Loop funziona bene finché un sito non supera qualche decina di post.
Quattro problemi si presentano una volta che la griglia diventa lunga:
- I lettori non possono restringere l'elenco. I filtri lato editor sono fissi, quindi ogni visitatore ottiene la stessa griglia indipendentemente da ciò che stava cercando.
- Le griglie lunghe nascondono i tuoi migliori contenuti. Un lettore che deve scorrere pagina dopo pagina di post spesso rinuncia prima di raggiungere quello che desiderava.
- Il percorso del codice richiede uno sviluppatore. WordPress consente agli sviluppatori di modificare i risultati del Query Loop con l'hook query_loop_block_query_vars, ma ciò significa scrivere e mantenere PHP.
- I ricaricamenti completi della pagina rallentano la navigazione. Ogni volta che un filtro ricarica l'intera pagina, il lettore perde il proprio punto e attende che tutto venga caricato di nuovo.
Un plugin di filtri aggiunge filtri cliccabili accanto al tuo Query Loop esistente, quindi non devi cambiare le sue impostazioni o scrivere PHP.
Come aggiungere filtri al blocco Query Loop di WordPress con WPFilters
Consigliamo WPFilters come il modo più semplice per aggiungere filtri per i visitatori a un blocco Query Loop.
WPFilters è il miglior plugin di filtraggio per WordPress, creato dallo stesso team dietro SearchWP.
Ti consente di creare filtri dalle categorie, tag e campi personalizzati che il tuo sito ha già, quindi posizionarli accanto a qualsiasi Query Loop senza scrivere codice.
Ecco alcune delle funzionalità che rendono WPFilters una buona scelta per le pagine Query Loop:
- Funziona con il blocco Query Loop. WPFilters si collega automaticamente al blocco Query Loop, quindi non c'è alcuna impostazione aggiuntiva da attivare.
- Sette tipi di elementi. Puoi scegliere tra Casella di controllo, Radio, Menu a discesa, Menu a discesa (Selezione multipla), Slider, Ricerca e Reimposta, a seconda di come desideri che i visitatori restringano l'elenco.
- Nessun ricaricamento della pagina. Quando un visitatore seleziona un filtro, WPFilters utilizza AJAX per aggiornare i risultati del Query Loop sul posto.
- URL dei filtri condivisibili. Ogni selezione viene salvata nell'URL della pagina, in modo che un lettore possa aggiungere ai preferiti o condividere una visualizzazione filtrata.
Detto questo, vediamo come puoi usare WPFilters per aggiungere filtri al tuo blocco Query Loop.
Passaggio 1: Installa e Attiva WPFilters
Per iniziare, puoi iscriverti a un piano WPFilters sul sito web di SearchWP.
Una volta iscritto, puoi accedere alla scheda Download nella dashboard del tuo account.
Da lì, procedi e scarica il file ZIP del plugin WPFilters.
Mentre sei lì, copia anche la tua chiave di licenza, poiché ti servirà tra poco.
Successivamente, puoi accedere alla tua dashboard di WordPress e installare il plugin.
Se non hai mai installato un plugin da un file ZIP prima, vedi questa guida passo passo che ti accompagna nel processo.
Dopo l'attivazione, verrà aperto il wizard di onboarding. Puoi fare clic su Iniziamo e seguire le istruzioni sullo schermo per iniziare.
Fatto ciò, WPFilters è pronto e puoi creare il tuo primo filtro Query Loop.
Passaggio 2: Crea un elemento filtro per categoria
Per creare il filtro, puoi accedere a WPFilters » Elementi dalla tua dashboard di WordPress.
Da lì, procedi e fai clic sul pulsante Aggiungi nuovo nella parte superiore dello schermo.
Si aprirà un nuovo elemento con un titolo predefinito e puoi fare clic sull'icona della matita accanto ad esso per rinominarlo con qualcosa di chiaro, come "Filtra per destinazione".
Successivamente, puoi trovare la sezione Campi filtro e selezionare Casella di controllo.
Ci piace la Casella di controllo per le pagine Query Loop perché consente ai lettori di scegliere più categorie contemporaneamente, come Portogallo e Giappone insieme.
Dopo di che, puoi scorrere verso il basso fino alla sezione Origine dati e aprire il menu a discesa.
Sotto il gruppo Tassonomie, procedi e seleziona Categorie (category).
Una volta impostata l'origine dati, puoi regolare l'aspetto del filtro.
Nelle impostazioni Contenitore, puoi attivare l'interruttore Mostra titolo in modo che i visitatori vedano un'etichetta sopra le caselle di controllo.
Sono presenti anche gli interruttori Collapsible e Orizzontale, se desideri un filtro che si ripieghi o si trovi in un'unica riga.
Nelle impostazioni Elementi, consigliamo di attivare Conteggio elementi, che mostra quanti post si trovano in ciascuna categoria.
Puoi anche disattivare Mostra vuoto, in modo che le categorie senza post rimangano nascoste.
Mentre modifichi queste impostazioni, il pannello Anteprima live mostra come apparirà il filtro.
Quando sei soddisfatto, fai clic su Salva.
Passaggio 3: Aggiungi il filtro accanto al tuo blocco Query Loop
Successivamente, puoi aprire la pagina in cui desideri il filtro nell'editor a blocchi (Gutenberg).
Se la pagina non ha ancora un Loop di query, puoi aggiungere un blocco Loop di query e impostarlo per mostrare i tuoi post.
Dopo di che, fai clic sull'inseritore + sopra il Loop di query e cerca il blocco Elemento WPFilters.
Una volta che il blocco è sulla pagina, puoi aprire Seleziona elemento nelle impostazioni del blocco e scegliere “Filtra per destinazione”.
Y
Puoi posizionare il filtro sopra il loop, o usare un blocco Colonne per metterlo in una colonna della barra laterale accanto al loop.
Quando tutto è al suo posto, salva o pubblica la pagina.
Nota: Quando abbiamo testato due blocchi Loop di query su una pagina, entrambi hanno mostrato gli stessi risultati filtrati, perché WPFilters applica il filtro a ogni blocco Loop di query sulla pagina. Se hai bisogno di un secondo elenco che rimanga non filtrato, come una sezione “Post recenti”, puoi usare invece il blocco Post più recenti.
Se preferisci non usare il blocco, il pulsante Incorpora nella schermata dell'elemento ti offre anche un'opzione di shortcode e un'opzione di codice PHP.
Passaggio 4: Testa i tuoi filtri Query Loop
Ora puoi visitare la pagina sul front-end del tuo sito e provare il filtro.
Per il primo test, seleziona la casella di controllo “Portogallo”. Il Loop di query dovrebbe aggiornarsi subito per mostrare solo i tuoi post del Portogallo, senza ricaricare la pagina.
Noterai anche che l'URL della pagina cambia per includere la tua selezione.
Per il secondo test, fai clic sulla pagina successiva dei risultati. La pagina due dovrebbe mostrare ancora solo i post del Portogallo, con la casella di controllo ancora selezionata.
Puoi anche copiare l'URL e aprirlo in una nuova finestra del browser. Dovrebbe caricarsi la stessa visualizzazione filtrata, il che significa che i visitatori possono condividerla o aggiungerla ai preferiti.
Bonus: Aggiungi un pulsante di reset o una ricerca per parole chiave
Una volta che il filtro per categoria funziona, puoi aggiungere altri elementi accanto ad esso.
L'elemento Reset aggiunge un pulsante che cancella tutte le selezioni in una volta, cosa che abbiamo trattato nella nostra guida su come aggiungere un pulsante di filtro di reset in WordPress.
L'elemento Cerca aggiunge una casella di parole chiave, in modo che i visitatori possano restringere l'elenco digitando una parola, come “spiagge”.
Quando SearchWP è attivo sul tuo sito, quell'elemento Cerca utilizza il motore di ricerca di SearchWP invece della ricerca predefinita di WordPress.
Domande Frequenti
1. È possibile filtrare il blocco Loop di query senza un plugin?
Solo dal lato dell'editor. Il pannello Filtri del blocco Loop di query ti consente di scegliere quali categorie, tag, autori o parole chiave mostra il loop, ma i visitatori non possono modificare queste scelte.
Consentire ai visitatori di filtrare il loop senza un plugin significa scrivere PHP personalizzato con l'hook query_loop_block_query_vars.
2. WPFilters funziona con un Loop di query che mostra prodotti WooCommerce?
WPFilters si collega al blocco Product Template di WooCommerce nello stesso modo in cui si collega al normale Query Loop.
Puoi creare il filtro a partire dai dati del prodotto, come le Categorie di prodotti (product_cat) nel gruppo Tassonomie sotto Origine dati.
3. I miei filtri Query Loop continueranno a funzionare nella pagina successiva dei risultati?
Sì, i filtri selezionati rimangono nell'URL quando un visitatore clicca sulla pagina successiva.
La pagina successiva viene caricata con gli stessi filtri applicati e le stesse caselle selezionate.
4. Posso filtrare due blocchi Query Loop separatamente nella stessa pagina?
No, WPFilters applica il filtro a ogni blocco Query Loop in una pagina, quindi due loop mostreranno gli stessi risultati filtrati.
Se hai bisogno di un secondo elenco che rimanga non filtrato, puoi usare il blocco Articoli più recenti.
Cosa fare dopo…
Ora hai un filtro per categoria accanto al tuo blocco Query Loop, con risultati che si aggiornano senza ricaricare la pagina e un URL che i tuoi lettori possono condividere.
Potresti anche voler consultare le nostre guide su come filtrare per più tassonomie in WordPress e impostare filtri in WordPress senza codice.
Pronto a far filtrare il tuo Query Loop ai tuoi lettori? Puoi iniziare con WPFilters qui. Ogni piano include una garanzia di rimborso di 14 giorni.
