Personalizza il caricamento del tuo Template

Costruire un template WordPress è stata la prima attività che mi ha avvicinato a questa piattaforma, mi è piaciuta talmente tanto che ci ho anche scritto una serie! Per mia fortuna questa piattaforma può fare sempre di più e adesso che abbiamo le REST API è giunto il momento di approfondire ulteriormente la sua conoscenza.

Infatti oggi non parleremo nello specifico di template, a parte il corso che ti ho appena presentato si trovano moltissime risorse sul web che ti permettono di approfondire l’argomento. Noi stessi stiamo portando avanti la creazione di un nuovo corso dedicato a questo argomento sul nostro portale formativo.

Se l’argomento ti interessa ti consiglio di venire a scoprire skillsAndMore.

Ma come stavo dicendo, oggi non si parla di template, piuttosto si parla di come sia possibile gestirne il caricamento, si tratta di capire quale sia la logica che sta alla base di WordPress e del suo sistema di template; si tratta di conoscere meglio questa piattaforma.

Prima di proseguire ti devo avvertire di una cosa, se sei intenzionato a continuare nella lettura di questo articolo ti devi assicurare di conoscere bene la struttura e il funzionamento della gerarchia WordPress all’interno dei suoi template.

Questo perché in questo articolo andremo a vedere alcuni di questi contesti e se non ti ricordi che WordPress ha una serie di pagine che carica in base all’utilizzo nel template rischi di non apprendere al meglio da questo articolo.

Come ormai dovresti sapere, la logica di WordPress si basa sugli Hook che ci permettono di agganciarci a determinate azioni o eventi che accadono durante la generazione della nostra pagina HTML; in questo articolo andremo proprio a conoscere una serie di Hook che ci permettono di personalizzare sia la gerarchia sia la possibilità di caricare o meno il template intero.

Ti chiedi forse del perché fare una cosa del genere? Andiamo a scoprire il primo Hook che ti svelo questo primo particolare.

Evita il caricamento del template con template_redirect

Questo è un Action Hook che viene eseguito prima ancora che venga determinato quale template il nostro utente ha scelto di visualizzare e ci permette di impedire il caricamento del template.

Non caricare un template?

Non caricare un template?

Forse sei un po’ confuso. Perché mai dovresti impedire il caricamento del template che hai costruito con tanto sforzo?

Come dicevo nell’introduzione, ad oggi WordPress è ben lontano dall’essere quella piattaforma di blogging che ha rappresentato la sua nascita, ad oggi WordPress è un CMS completo!

Infatti un’azione come questa ci può tornare comoda quando abbiamo bisogno che la nostra piattaforma risponda ad una determinata richiesta senza neanche dover caricare il template. Molto spesso ci troviamo di fronte a questa situazione quando usiamo le WordPress REST API dove la richiesta che viene inviata al nostro server invoca template_redirect per permettere soltanto la creazione dell’oggetto JSON e terminare la sessione.

Praticamente si ottengono le informazioni contenute nel nostro database senza neanche dover mettere in moto il motore di template che WordPress ha al suo interno, questo si traduce in un’ottimizzazione dei processi e prestazioni migliori per l’utente finale.

Un altro esempio dell’utilizzo di questa funzione è quello di poterla utilizzare per cacciare gli utenti loggati da una pagina specifica, magari una pagina dove condividiamo del contenuto soltanto con i nostri iscritti!

Se sei rimasto a bocca aperta dal fatto che sia presente una funzione come secondo parametro del nostro add_action() non devi assolutamente agitarti. Queste si chiamano funzioni anonime e sono state introdotte in PHP dalla versione 5.3. Sono molto utili perché, un po’ come accade in JavaScript, ci permettono di scrivere meno codice e l’organizzazione rispecchia da vicino la logica di utilizzo dato che vengono create ed eseguite nel momento stesso in cui vengono trovate.

Avresti potuto anche creare questo controllo senza l’uso di template_redirect, magari avresti potuto appoggiarti all’azione the_post ma così facendo avresti lasciato che WordPress caricasse tutto il template e rallentasse quindi l’esperienza del tuo utente, tutto per venir poi buttato fuori 🙂

Individua parti singole del tuo template

Sono sicuro che molto probabilmente ti sei trovato a lavorare con dei plugin scritti bene che, oltre a popolare il backend della nostra piattaforma, ci permettono anche di avere la parte del frontend già popolata e con diversi stili applicati ad esse.

Sforzati per un attimo… Sono convinto che te ne viene in mente almeno uno.

Non ce la fai? Vabbene ti tolgo la fatica, uno di questi è WooCommerce. Se ci fai caso, una volta installato questo plugin hai le pagine Prodotto, Carrello e molte altre già presenti nel tuo tema e già personalizzate da regole CSS, eppure nella cartella del tuo tema non è presente un single-product.php o un page-car.php, come hanno fatto ad inserire queste pagine?

Ebbene hanno usato un Filter Hook di WordPress davvero interessante, un Filter Hook che cambia il nome dinamicamente in base alla pagina che stiamo cercando di visualizzare!

Se vogliamo dargli un nome generico possiamo chiamarlo type_template ma sono sicuro che con un esempio più concreto la sua funzionalità sarà più chiara.

Prendiamo la classica pagine dove viene mostrato un singolo articolo, come ormai dovresti sapere WordPress sceglie di utilizzare il file single-post.php per dare struttura a questo elemento, la cosa che non sapevi ancora è che usa proprio questo stesso filtro per prendere la sua decisione.

All’interno del core WordPress dove grazie a un ciclo è in grado di comprendere il tipo di pagina che vogliamo visualizzare e creare automaticamente il filtro single-post_template.

Tornando all’esempio di WooCommerce, anche se non sono andato a controllare il suo codice sorgente, posso immaginare che all’interno del suo plugin si trovi qualcosa del genere:

Praticamente WooCommerce sta dicendo a WordPress che prima ancora di andare a cercare il file che fornisce struttura al suo CPT deve entrare all’interno della cartella template/ presente nel plugin e caricare il file single-produt.php.

Questa è la stessa tecnica che ha implementato il nostro Daniele nella creazione del suo WordPress Plugin Boilerplate, praticamente usando la sua soluzione disponibile su GitHub puoi creare la struttura base del tuo plugin e tutte le pagine frontend di cui hai bisogno!

Una cosa da chiarire è che questa soluzione non è in grado di sovrascrivere la funzionalità interna di WordPress in grado di riconoscere le pagine all’interno della cartella del tema; questo perché se trova lo stesso file dentro la cartella del tema con lo stesso percorso, ovvero all’interno della cartella template/, andrà a caricare il file presente nel tema piuttosto che quello nel plugin.

E questa è una funzionalità incredibilmente interessante perché è proprio come WooCommerce e tutti i plugin che vengono sviluppati seguendo la WordPress Way fanno il proprio lavoro!

Prima di passare al prossimo Hook voglio chiarire un dubbio che forse precedentemente ti ha colpito: perché non uso la funzione is_singular() per accertarmi che mi trovo effettivamente in una di queste pagine?

dubbio

Ebbene grazie a questo filtro un controllo del genere è superfluo perché, dato che è creato dinamicamente nella logica di WordPress, verrà eseguito soltanto se si troverà a dover caricare quel tipo di pagina.

Sovrascrivi qualsiasi comportamento con template_include

Con il filtro che ti ho presentato precedentemente hai conosciuto una soluzione che ti permette di comprendere quale file caricare in base alla pagina che stiamo visualizzando. In un contesto come quello di WooCommerce, che si trova costretto a dover creare un gran numero di pagine e CPT per gestire le varie attività interne ad un eCommerce, questo fa anche molto senso. Però non sempre è l’effetto che stiamo cercando, possono capitare delle occasioni dove vogliamo sovrascrivere completamente il file che stiamo caricando.

Facciamo un piccolo esempio che però ci è utile come esercizio di stile. Diciamo che vuoi sviluppare un tema nipote.

Anche se questo non esiste all’interno delle definizioni WordPress, dato che al limite esistono i child theme, diciamo che hai bisogno di creare un child theme per un child theme; in questo contesto utilizerai un plugin che si comorta come nipote. A questo punto, nel file principale del plugin, inserirai qualcosa come segue:

Praticamente con questo codice stiamo controllando quale sia il tema che WordPress sta cercando di caricare, una volta trovato il nome della cartella controlliamo che all’interno del nostro plugin sia presente una cartella che porta lo stesso nome, se viene trovata verrà caricata questa al posto della cartella del tema principale.

Riconosco che il ragionamento è un po’ contorto ma è un esempio molto avanzato sugli usi corretti del filtro template_include.

Nella frase precedente ho parlato di usi corretti perché trovo questa funzione molto utilizzata per creare le pagine frontend dei nostri plugin, ma questo non è un uso corretto. Dato che questo filtro viene lanciato come ultimo il nostro WordPress si troverà nella situazione di aver già eseguito tutti i cicli foreach che gli hanno permesso di selezionare la pagina del tema che vuole caricare e questo colpisce non poco le nostre prestazioni.

Ho scelto di inserirti anche questo filtro per completezza del concetto ma stai bene attento a quando la utilizzi. Chiediti sempre se c’è la possibilità di di utilizzare i filtri dinamici che abbiamo appena conosciuto, ti assicuro che le prestazioni del tuo WordPress ne beneficeranno.

Conclusioni

Ebbene in questo articolo abbiamo parlato di ben tre Hook differenti che ti permettono di poter personalizzare il caricamento delle pagine del tuo template, come puoi vedere queste informazioni sono utili sia che tu stia sviluppando un tema altamente complesso per un cliente che un nuovo tipo di plugin con diverse interazioni lato frontend.

Ovviamente, se hai intenzione di rilasciare il tuo tema all’interno del repository WordPress non potrai utilizzare queste funzionalità perché vanno a modificare la logica della gerarchia dei file e questa non è un’attività consentita.

Alla fine poco importa perché le nozioni che hai appreso da questo articolo ti saranno comunque incredibilmente utili per poter sviluppare dei prodotti professionali.

E dato che è lo scopo di tutto il network AndMore è quello di farti diventare ogni giorno un professionista affermato. Ti ricordo nuovamente che abbiamo creato appositamente una scuola online che ti permette di migliorare quotidianamente le tue conoscenze web e di metterti a confronto con nuovi sviluppatori che potranno diventare anche tuoi collaboratori.

Ti dico questo perché molto spesso si pensa di non aver bisogno di queste cose e anche se ultimamente mi trovo spesso a fare riferimento a skillsAndMore lo faccio soltanto perché personalmente ho tratto moltissimi benefici dal confronto con i miei colleghi e vorrei tanto che anche tu possa provare questa sensazione.

Se ritieni che ho rotto le scatole e che dovrei smettere di parlare del nostro progetto, fammelo sapere attraverso i commenti. Sai benissimo che prendo in considerazione le tue opinioni e che per me hanno un grandissimo valore.

Lascia il tuo Pensiero

2 Responses to “Personalizza il caricamento del tuo Template”

  1. carlo

    ottimo articolo Andrea!
    ti segnalo che nell’ultimo esempio ci sono alcune variabili che prima hanno un nome (es. $percorso) e poi ne hanno un altro (es. $path) 🙂

    Rispondi
    • Andrea Barghigiani

      Ciao Carlo e grazie mille per questa correzione, non sai il piacere che provo quando i nostri lettori ci permettono di scoprire alcuni refusi. Oltre che migliorarne la qualità ci fa capire che leggete veramente i nostri lunghi articoli.

      Grazie ancora e a presto,
      Andrea

      Rispondi