Come Visualizzare un Custom Post Type

Come Visualizzare un Custom Post Type

Diverso tempo fa ho pubblicato un articolo in cui ti spiegavo come sia possibile creare un Custom Post Type. Dai commenti ricevuti, tutti si sono lamentati sul fatto che il mio codice non funzionasse, in questo caso il discorso è diverso perché il codice funziona perfettamente, ma forse ho lasciato qualcosa al caso...

Quando si parla di Custom Post Type (CPT per gli amici 😉 ) si fa riferimento ad una caratteristica davvero potente ed interessante che WordPress ci ha messo a disposizione, ovvero la possibilità di creare e personalizzare una nuova famiglia di articoli.

Se hai già usato plugin come WooCommerce o anche dei temi avanzati con portfolio integrato, ti sarà capitato di avere a disposizione una nuova voce all’interno del tuo backend, una voce che se selezionata permette di accedere a delle funzionalità molto simili a quelle di un classico Articolo ma con una struttura che può essere incredibilmente personalizzata.

Come dicevo prima, con l’articolo di oggi voglio fare chiarezza su un concetto molto particolare, il codice che ti ho presentato nell’articolo precedente permette di creare un CPT all’interno del tuo backend ma per visualizzarlo nel tuo frontend è necessario creare qualche nuova pagina e fare un po’ di pratica con la classe WP_Query.

Perché Hai la Necessità di Creare Nuovi File?

Capiamoci bene, WordPress è un CMS favoloso, già di partenza ci permette di fare moltissime cose ed avere un sito completamente funzionante nel giro di pochi minuti, ma la creazione di un CPT è una personalizzazione di questo sistema e come tale richiede anche un approccio particolare.

Dato che stiamo personalizzando una piattaforma, non possiamo andare ad aggiungere una nuova struttura e pensare che magicamente questa funzioni, sopratutto se questa funzionalità deve essere presente sia nel suo backend che nel frontend.

Con il codice seguente, che abbiamo usato nello scorso articolo, sei stato in grado di dire a WordPress di creare un CPT; sarà quindi in grado di gestire le informazioni che inserisci, salvarle nel database e metterti a disposizione tutte quelle funzionalità che desideri utilizzare, purtroppo non è ancora in grado di mostrare questi elementi. Ma questo soltanto perché non gli abbiamo ancora detto come fare…

Se fai un semplice copia/incolla di questo blocco di codice all’interno del tuo functions.php, un file molto importante all’interno del tuo tema, non fai altro che dire a WordPress di creare questa struttura e di personalizzarla per le tue necessità (come per l’aggiunta dei campi relativi al lavoro da inserire nel portfolio) ma, come dicevo, non gli stai dicendo come mostrarli.

Questo perché la creazione di un CPT comporta anche l’inserimento di nuovi file all’interno della gerarchia del tuo tema, cosa molto importante da conoscere se vuoi lavorare con WordPress.

Se sei andato a consultare la lezione del corso “Crea un Tema WordPress, da Zero” hai fatto molto bene perché al suo interno è presente una spiegazione molto dettagliata sul funzionamento di questo concetto, se così non fosse ti consiglio invece di farlo perché d’ora in avanti parlerò di alcuni dettagli che considerano necessari i concetti presentati a lezione.

Quando devi creare un file per mostrare il tuo CPT devi stare molto attento ad utilizzare l’abbreviazione inserita in fase di registrazione dello stesso. Se ti sto facendo girare la testa, in poche parole si tratta della stringa che si trova all’interno della funzione register_post_type():

Come puoi vedere, l’abbreviazione inserita nel nostro codice di esempio, prende il valore di portfolio quindi, facendo riferimento alla gerarchia dei file WordPress, i principali file che dovrai creare saranno: single-portfolio.php e archive-portfolio.php.

Con questi due file sarai in grado di creare delle strutture personalizzate sia per mostrare la pagina che conterrà il singolo CPT che per quella che ne mostrerà l’archivio; ma ancora il tuo CPT non si vede nella Homepage e tantomeno troviamo una voce che ci permette di aggiungere semplicemente la nostra pagina archivio all’interno del menu…

Come Mostrare i CPT

Abbiamo già parlato della possibilità di creare dei Loop personalizzati che ci permettono di mostrare qualsiasi informazione salvata all’interno del database che gestisce il nostro WordPress e quando parliamo di CPT abbiamo una scusa in più per usarla 😉

Usare la classe WP_Query non è l’unico modo per poter creare dei Loop personalizzati, ma personalmente è quella con la quale mi trovo meglio ed è anche quella più spinta dalla stessa WordPress quindi… Perché non usarla 😉

Diciamo quindi che siamo di fronte al codice della nostra index.php (o quello della front-page.php, se come me sei un malato della gerarchia nei temi WordPress 😉 ), vogliamo essere in grado di visualizzare i nostri CPT che, in questo caso, mostreranno i nostri ultimi lavori ma pur aggiornando più volte la pagina non siamo in grado di visualizzarli.

Senza entrare troppo nel dettaglio di come mostrare questi lavori, e quindi analizzare da vicino il codice CSS che potremmo utilizzare, cerchiamo di capire come mostrare gli ultimi 3 lavori.

Ovviamente la tua Homepage sarà strutturata in maniera molto diversa da quella che ti sto per proporre che, tra le righe, proviene dal blank theme _s che ti ho presentato qualche articolo fa; ma comunque dovresti essere in grado di seguire le varie modifiche che andremo ad applicare.

Come puoi notare tu stesso, al rigo 10 e al 18 sono presenti semplicemente due commenti PHP. Il primo ci avvisa che stiamo aprendo il Loop WordPress mentre il secondo ci avvisa della sua chiusura (se hai scaricato il tema _s avrai soltanto il commento di apertura, ma sarai comunque in grado di seguire passo passo le mie spiegazioni).

Quello che devi fare a questo punto è creare il tuo Loop personalizzato che ti permetterà di inserire i tuoi ultimi lavori. Personalmente vado ad inserire il codice che ti sto per presentare sotto al commento /* Fine Loop */, tu potrai posizionarlo anche sopra o in qualsiasi altro punto della pagina, basta non inserirlo all’interno del Loop presente 😉

Aggiornando adesso la tua Homepage vedrai anche gli ultimi 3 lavori inseriti. Ovviamente questa è una impostazione base, molto base dato che mostrerà soltanto il titolo e il contenuto del tuo lavoro (e non anche i dettagli come cliente, URL ecc.. che abbiamo creato per questi), ma l’importante è che funzioni, non credi? 🙂

Come Aggiungere la Voce nel Menu

A dire il vero questo passaggio è ancora più semplice, dato che hai creato un CPT che ha una sua abbreviazione e anche una sua personale pagina archivio, tutto quello che devi fare è inserire la URL direttamente nel menu utilizzando la voce Link presente nello stesso gestore dei menu.

In poche parole dovrai inserire la URL http://miosito.it/portfolio proprio come ti mostro nella prossima immagine:

Aggiungi una Voce al tuo Menu

Conclusioni

Benissimo a questo punto dovresti avere tutte le informazioni necessarie per personalizzare e visualizzare i tuoi CPT. Come dicevo anche prima, in questo articolo abbiamo fatto riferimento al codice presente in un altro pubblicato precedentemente, cosa che ci ha obbligato ad utilizzare l’abbreviazione portfolio.

Ma tu non ti devi preoccupare troppo di queste cose perché sarai in grado di usare qualsiasi abbreviazione desideri per il tuo CPT, ti basterà modificarlo all’interno della funzione register_post_type() ed il gioco è fatto.

Se hai bisogno di qualche chiarimento aggiuntivo o ritieni che in questo articolo non ti ho spiegato bene i singoli passaggi ti invito a farmelo sapere attraverso i commenti, sono sempre lieto di correggere e sistemare gli articoli per permetterti un miglior apprendimento della piattaforma WordPress.

Se invece hai trovato l’articolo chiaro ed utile condividilo a più non posso!!! Ehehehehe no dai, sto scherzando; anche se qualche condivisione non farebbe male… Né a questo sito e tantomento alle persone che cercano informazioni di qualità su WordPress, non credi?

Lascia il tuo Pensiero