Questa guida è per te che hai un tipo di post personalizzato (CPT) e desideri una pagina di ricerca avanzata che cerchi i risultati all’interno di questo CPT. Nel modulo di ricerca puoi impostare diversi input per la ricerca all’interno di diversi campi; titolo del post, contenuto del post, qualsiasi tipo di meta personalizzato o per tassonomia personalizzata.
In questo post supponiamo di avere un tipo di post personalizzato per i libri, una tassonomia personalizzata allegata per il genere del libro e un mucchio di meta personalizzati; autore, anno di pubblicazione, numero ISBN e una casella di controllo se il libro è disponibile o meno. Il tipo di post personalizzato e i parametri dipendono completamente da te per adattarsi alle tue esigenze, il codice seguente cercherà semplicemente di coprire la maggior parte delle basi.
Cosa faremo
Creeremo un tipo di post personalizzato per i libri e una tassonomia gerarchica personalizzata allegata per genere. Inoltre, ogni libro ha campi personalizzati per autori, anno di pubblicazione, numero ISBN e una casella di controllo per includere o meno i libri che sono esauriti. Per quanto riguarda la pagina di ricerca stessa, creeremo un modello di pagina in cui risiederà la maggior parte del nostro codice. La pagina inizierà eseguendo il rendering di un modulo personalizzato all’inizio; mostrando tutti i parametri possibili per filtrare i risultati. Sotto di esso tutti i risultati del libro appariranno in un elenco. Decidiamo un numero di risultati per pagina e aggiungiamo l’impaginazione in fondo se il numero supera questo.
Questi sono i possibili parametri di filtro che creeremo per il nostro modello di ricerca avanzata:
- Input di testo per la ricerca di qualsiasi stringa all’interno del titolo del post e del contenuto del post.
- Menu a discesa per la scelta di un genere. Consente di scegliere un termine o lasciarlo su "Qualsiasi".
- Input per la digitazione del nome dell’autore che esegue la ricerca nella meta personalizzata. Una corrispondenza vaga che significa inserire "Mark" restituirà tutti gli autori il cui nome è o contiene "Mark".
- Inserimento numerico per l’inserimento dell’anno in cui è stato pubblicato il libro che esegue la ricerca nel meta personalizzato. Corrispondenza vaga che significa inserire, ad esempio, "20" corrisponderà a qualsiasi libro pubblicato nel 1920 o qualsiasi anno che inizia con 20.
- Input per l’inserimento dell’ISBN (International Book ID) che esegue la ricerca nel meta personalizzato. Restituisce solo corrispondenze precise.
- Casella di controllo per includere o meno libri esauriti, ancora un altro meta personalizzato. Per impostazione predefinita, questa opzione è deselezionata, il che significa che i risultati mostrano solo i libri che sono in stock.
Il modulo è impostato per utilizzare il metodo GET, il che significa che tutti i parametri cercati verranno aggiunti alla pagina nell’URL, sotto forma di " ?book-search=world&year-published=2016&book-author=mark". L’altra opzione se vuoi evitare di avere "URL brutti" sta usando Javascript e AJAX. Ma ci sono alcuni aspetti negativi di questo. Innanzitutto non sarà possibile aggiungere ai preferiti una ricerca con specifici parametri di ricerca “precompilati". Immagina di voler collegare direttamente la tua pagina di ricerca personalizzata da un autore specifico in un altro punto del tuo sito. È quindi possibile fare in modo che il collegamento vada alla pagina di ricerca, aggiungere " ?author=mark", e quindi fare clic sul collegamento porterà direttamente ai risultati per quell’autore. Questo non è possibile con AJAX.
I parametri di ricerca sono mutualmente inclusivi. Ciò significa che la combinazione, ad esempio, dell’anno "2011" e dell’autore "Some guy" restituirà solo libri che corrispondono a ENTRAMBI. Se specifichiamo anche "divertente" nell’input del testo di ricerca generale, otterremo solo ritorni che corrispondono a tutti e tre questi. Detto con parole diverse; useremo la logica AND. Questo è il metodo più comune per filtrare i risultati di ricerca.
Questo tutorial non includerà lo stile, quindi questa parte dipende da te. Di seguito è riportato un esempio di come potrebbe apparire con alcuni stili di base.
Una nota sull’impaginazione con una query personalizzata
Se desideri l’impaginazione su una query personalizzata all’interno di una singola pagina, ci sono alcune cose da tenere a mente. L’impaginazione di una query può essere generata con le funzioni di WordPress [the_posts_pagination](https://developer.wordpress.org/reference/functions/the_posts_pagination/)(), [paginate_links](https://developer.wordpress.org/reference/functions/paginate_links/)()o le due [next_post_link](https://developer.wordpress.org/reference/functions/next_post_link/)()e [previous_post_link](https://developer.wordpress.org/reference/functions/previous_post_link/)(). Tuttavia, questi sono codificati per funzionare con l’ wp_queryoggetto globale (che per un modello di pagina è la pagina stessa) e non con una query personalizzata.
Ci sono alcune soluzioni alternative, come scrivere tu stesso una funzione di impaginazione. Oppure potresti usare l’azione pre_get_postse manipolare l’ wp_queryoggetto. Sfortunatamente questo metodo è troppo tardi per influenzare le funzioni di impaginazione. Un’altra alternativa è saltare del tutto l’impaginazione e mostrare semplicemente tutti i post. Questa potrebbe essere un’opzione se non hai molti post, ma se stai creando un modello di ricerca personalizzato avanzato, presumo che tu abbia un bel po’ di post.
Quello che faremo in questa guida è una sorta di metodo "hackish". All’interno del modello di pagina sostituiremo l’ wp_queryoggetto con la nostra query personalizzata in modo che le funzioni di loop e di impaginazione funzionino come previsto. Questo metodo è quello con cui ho avuto più successo.
Senza ulteriori indugi, iniziamo a programmare!
Impostazione del tipo di post personalizzato, della tassonomia e dei meta campi
Il primo passo è definire il tipo di post personalizzato per il quale vogliamo creare un modello di ricerca avanzata. Se hai già impostato un tipo di post personalizzato o desideri implementarlo per post o pagine, puoi passare direttamente alla parte successiva.
Stiamo definendo un tipo di post personalizzato bookcon una tassonomia personalizzata gerarchica book_category. Non entrerò nei dettagli spiegando come creare tipi di post personalizzati e tassonomie qui. Se sei interessato a saperne di più ho un post che approfondisce questo argomento.
Inserisci questo codice ovunque nel codice del tuo tema functions.phpo del plugin:
Ciò risulterà in un tipo di post personalizzato con una tassonomia allegata in admin.
L’impostazione del meta post personalizzato dipende un po’ da te: gestiscilo manualmente con [add_meta_box](https://developer.wordpress.org/reference/functions/add_meta_box/)()o utilizza il plug-in Advanced Custom Fields (ACF), perfetto per questo tipo di lavoro. Userò ACF per impostare i campi in modo programmatico, in questo modo:
Ovviamente sei libero di impostare i campi ACF usando la GUI di amministrazione di ACF. Ma ci sono diversi vantaggi nell’aggiungerli tramite codice. Ad esempio assicurandoti di mantenere gli stessi campi ovunque attivi il tuo tema o plug-in. Se imposti i campi in admin, devi ricordarti di esportarli e importarli se cambi sito WordPress.
Si prega di notare i meta nomi; ad esempio book_author, year_published, e così via. Farai riferimento a questi quando creeremo la query personalizzata sul modello di ricerca avanzata.
Con il plug-in ACF e il codice sopra la modifica di un singolo libro sarebbe simile a questo:
Con questo siamo tutti bravi a creare tutti i post di libri che vogliamo. Il prossimo passo è creare il modello di pagina per la nostra ricerca.
Creazione del modello di pagina
Creiamo il modello di pagina in cui inseriremo il nostro modello di ricerca avanzata. Fai una copia del tuo tema single.phpo page.phpe rinominalo ad esempio in template-booksearch.php. L’HTML dipende da te, ma il motivo per cui facciamo una copia di una singola o di una pagina è perché sono probabilmente il modello più vicino in termini di layout.
Nella parte superiore del modello di pagina indichiamo che si tratta di un modello di pagina scrivendo "Nome modello" e il suo nome all’interno del blocco commenti. In questo modo ci assicureremo di poter selezionare il modello di pagina quando modifichiamo una pagina.
Le sezioni che dobbiamo codificare nel nostro modello sono le seguenti, in questo ordine:
- Memorizza tutte le variabili precedentemente inviate dal modulo, utilizzando
get_query_var(). È inoltre necessario memorizzare la pagina corrente - Rendere il modulo di ricerca con un pulsante di invio per eseguire una ricerca
- Reimposta l’
wp_queryoggetto - Impostare gli argomenti per un nuovo
WP_Query()in base ai parametri cercati ed eseguire la query. Assegna la query personalizzatawp_queryall’oggetto - Scorri i risultati e visualizzali. Visualizza anche i collegamenti di impaginazione
- Reimposta l’
wp_queryoggetto come era
Il motivo per cui abbiamo bisogno di memorizzare tutte le variabili cercate e la pagina corrente in anticipo è perché queste variabili andranno perse una volta ripristinato l’ wp_queryoggetto nel passaggio 3. Abbiamo anche bisogno delle variabili per il nostro modulo di ricerca, per popolare i campi.
Nel tuo modello decidi il luogo in cui desideri generare la tua ricerca personalizzata e iniziamo dall’alto:
1 Ottieni tutte le variabili cercate
Otteniamo i parametri GET (dall’URL) con [get_query_var](https://developer.wordpress.org/reference/functions/get_query_var/)(). Per esempio; se abbiamo un parametro ?book-author=benjaminnell’URL, using get_query_var('book-author')restituirebbe la stringa ‘ benjamin‘. Il recupero di tutte le variabili può essere eseguito in questo modo:
$search_string = get_query_var('book-search');
$author = get_query_var('book-author');
$category = get_query_var('book-category');
$year = get_query_var('year-published');
$isbn = get_query_var('isbn');
$out_of_stock = get_query_var('out-of-stock');Ma questi sono tutti parametri personalizzati che non fanno parte dei parametri GET standard di WordPress. WordPress ignorerà tutti i parametri GET che non conosce, quindi chiamarli restituirà sempre una stringa vuota. Dobbiamo dire a WordPress di consentire ciascuno di questi parametri GET. Lo facciamo filtrando query_vars. Nel tuo functions.php, aggiungi anche questo:
add_filter('query_vars', function($vars) {
$vars[] = 'book-search';
$vars[] = 'book-author';
$vars[] = 'book-category';
$vars[] = 'year-published';
$vars[] = 'isbn';
$vars[] = 'out-of-stock';
return $vars;
});Ora i nostri get_query_var()dovrebbero essere in grado di recuperare i parametri GET. Se non sono impostati, restituisce una stringa vuota.
Abbiamo anche bisogno di recuperare la pagina corrente prima di rovinare l’ wp_queryoggetto. La pagina corrente è un parametro GET nascosto chiamato paged. Lo recupereremo allo stesso modo degli altri nostri parametri GET, ma lo imposteremo come predefinito su 1 se è vuoto.
$paged = (get_query_var('paged'))? get_query_var('paged'): 1;Nota: poiché pagedè un parametro standard di WordPress, non è necessario aggiungere pagedal query_varsfiltro.
2 Eseguire il rendering del modulo di ricerca
Il modulo di ricerca sarà semplicemente un <form>con gli input necessari e un pulsante di invio del modulo. L’HTML dipende completamente da te, nell’esempio seguente aggiungo gli input in un semplice elenco. Non includerò alcuno stile in questo tutorial, dipende da te. Puoi scegliere di impostare lo stile del modulo di ricerca in modo che risieda nella parte superiore dei risultati o di lato, verticalmente verso il basso insieme ai risultati della ricerca.
Nota: per abbreviare e modulare il modello di ricerca avanzata è possibile separare la parte del modulo di ricerca in un file modello separato e includerlo con [get_template_part](https://developer.wordpress.org/reference/functions/get_template_part/)(). Ma per semplicità di questo tutorial includerò tutto all’interno del file modello stesso.
Il modulo stesso deve essere del metodo GET e l’azione deve puntare alla pagina in cui ci troviamo. Per fare ciò accediamo $postall’oggetto globale e ne ricaviamo il permalink. Alla fine aggiungiamo un pulsante di invio che invierà il modulo.
All’interno dell’elenco non ordinato aggiungeremo un input appropriato per ciascuno dei nostri possibili parametri di ricerca. Modifica l’HTML e i parametri di ricerca in base alle tue esigenze:
Si prega di prendere nota degli nameattributi; sono ciò che apparirà nell’URL quando il modulo viene inviato. Devono corrispondere a query_varse get_query_var()abbiamo definito in precedenza!
Il codice precedente inizia eseguendo il rendering di un input di testo per la ricerca di testo generale. Impostiamo la valuevariabile cercata in precedenza che abbiamo recuperato utilizzando get_query_var(). Ciò garantisce che l’input non venga cancellato dopo aver eseguito una ricerca.
Il parametro successivo è un menu a discesa del genere dalla nostra tassonomia personalizzata. Per rendere questo utilizziamo la funzione [wp_dropdown_categories](https://developer.wordpress.org/reference/functions/wp_dropdown_categories/)(). Dai un’occhiata alla pagina della documentazione per vedere perché aggiungiamo tutti questi parametri per adattare il menu a discesa alle nostre esigenze. È importante che taxonomysia impostato sulla nostra tassonomia personalizzata, l’ nameattributo sia corretto e selectedimpostato sul valore della variabile ricercata in precedenza. Inoltre, impostiamo i valori dei termini in modo che siano i loro slug anziché gli ID dei termini. Sembra meglio con ?book-category=fictioninvece di ?book-category=42. Attiviamo anche un’opzione "nessuno" per aggiungere un’opzione "Qualsiasi genere".
Successivamente eseguiamo un altro input di testo per la ricerca dell’autore, un input di numero per l’anno di pubblicazione, un input di testo per il numero ISBN e infine una casella di controllo che di default è deselezionata per includere i libri esauriti.
3 Reimpostare wp_query
Il passaggio successivo è un piccolo trucco per garantire che l’impaginazione funzioni per la nostra query personalizzata. Memorizziamo semplicemente la corrente $wp_queryin una variabile e quindi la impostiamo su null. Successivamente, nel passaggio 6, lo ripristineremo dalla $tmp_wpqueryvariabile.
$tmp_wpquery = $wp_query;
$wp_query = null;4 Impostare gli argomenti ed eseguire query personalizzate
Questa parte riguarda l’esecuzione di una nuova query. Iniziamo impostando gli argomenti più elementari, quindi aggiungiamo condizionalmente parametri a seconda di ciò che è stato trovato nelle variabili ricercate in precedenza (dal nostro get_query_var()s).
Il codice sopra sta fondamentalmente costruendo un WP_Querycon parametri. La pagina della documentazione per WP_Queryè un’ottima risorsa per capire come creare una query.
I primissimi argomenti assicurano che interroghiamo solo i libri e che stiamo informando correttamente su quale pagina ci troviamo attualmente, dalla pagedvariabile che abbiamo recuperato in precedenza. Il numero di post per pagina dipende da te, l’ho semplicemente impostato su 20.
Nota che aggiungendo ‘ compare‘ a ‘ LIKEWordPress cercherà qualsiasi cosa che contenga la stringa data. Non l’ho aggiunto alla ricerca ISBN perché per questo campo voglio che trovi risultati che corrispondano perfettamente.
La cosa importante è proprio alla fine, quando eseguiamo effettivamente la query e assegniamo quella query alla wp_queryvariabile.
5 Scorrere i risultati della query e eseguire il rendering dell’impaginazione
Questo passaggio è davvero facile. Tutto ciò di cui abbiamo bisogno è un ciclo standard e per ciascuno eseguiamo il rendering del post del libro come vorremmo. Questa parte dipende completamente da te.
Il codice seguente mostra un esempio di base di scorrere i risultati, chiamando get_template_part()ogni post. Dopo che il ciclo the_posts_pagination()viene utilizzato per eseguire il rendering dei collegamenti di impaginazione. Se la query non ha restituito post, viene visualizzato un semplice paragrafo con un testo.
Regola l’HTML e l’output in base alle tue esigenze. Il codice precedente prevede un file modello nel tema denominato content-book.phpper il rendering di un singolo libro nel ciclo. Non ti mostrerò come eseguire il rendering di ogni post poiché questo è qualcosa su cui molto probabilmente hai già il controllo.
6 Reimposta wp_query su quello che era
Il passaggio finale consiste nel ripristinare l’ wp_queryoggetto su ciò che abbiamo memorizzato in precedenza nel passaggio 3. Lo impostiamo per nullprimo per assicurarci che venga ripristinato.
$wp_query = null;
$wp_query = $tmp_wpquery;Conclusione e risultato finale
E questo è tutto! Ora dovresti avere un modello di ricerca personalizzato avanzato completamente funzionante. Spero che questo ti sia stato di aiuto: il codice è stato scritto il più generale possibile per semplificare l’adattamento alle tue esigenze. Forse vuoi diversi tipi di parametri, o il tuo tipo di post personalizzato è per i film o qualcos’altro!
Con alcuni stili di base può facilmente assomigliare a questo:
Ecco il codice finale; la functions.phpparte e il modello: