Come Creare una Author Box in WordPress

Come ti Creo una Author Box

WordPress è una piattaforma davvero potente per quanto riguarda la gestione e pubblicazione del proprio contenuto, ma talvolta lascia qualcosa a desiderare quando si tratta di dare credito ai nostri autori. Quest'oggi voglio aiutarti a creare un author box accattivante, il che mi permette anche di rispondere ad una interessante discussione apparsa su WordPress Italy+.

Partiamo subito dicendo che le soluzioni sono molte: esiste la possibilità di utilizzare dei plugin, oppure quella di sviluppare tutto da soli; in entrambi i casi le strade da percorrere sono molteplici.

In questo articolo ti descriverò le scelte che farei io: non ti sto ovviamente dicendo che siano le migliori; sono semplicemente quelle con cui ho più confidenza.

Dato che ti trovi su un sito che si rivolge nello specifico a sviluppatori WordPress, la prima pratica che ti andrò a descrivere riguarda proprio lo sviluppo di un author box da zero, ma a fine articolo ti presenterò un plugin che potrebbe aiutarti a raggiungere la stessa funzionalità (anche se sarai meno padrone della sua personalizzazione).

Prima di tuffarci nello sviluppo dobbiamo capire una cosa: quando vogliamo conoscere i dati di un autore, dobbiamo ricordarci che questo è relativo all’articolo e quindi è necessario conoscere il suo ID, contenuto nelle proprietà dell’articolo stesso. In realtà WordPress ci fornisce alcune funzioni che ci permettono di ottenere queste informazioni anche fuori dal Loop ma in questa sede non le vedremo.

Inserire una Author-Box nel Loop

Prendiamo quindi il caso più semplice: mettiamoci all’interno del Loop ed andiamo ad analizzare il codice che io stesso utilizzo per inserire le informazioni dell’autore all’interno di questo sito.

Il codice che vedi è stato inserito all’interno del file single.php ma potrebbe essere inserito anche in altri file template come ad esempio il page.php.

Come puoi notare, in questo frammento di codice ci sono diverse funzioni WordPress; andiamo ad analizzarle una per una:

  • get_the_author_meta() questa è la prima funzione che dovrai imparare ad amare, perché ti permette di accedere a tutte le informazioni che WordPress conosce sul tuo utente. Come puoi vedere dal rigo 2, in questo caso sto richiamando un campo personalizzato aggiunto dal plugin WordPress SEO by Yoast, ma a breve ti mostrerò come sia possibile aggiungere un tuo campo senza dover ricorrere a plugin. Se vuoi avere maggiori informazioni su questa funzione, ti consiglio di controllare il Codex che presenta la lista di tutti i campi standard: sono davvero molti!;
  • get_avatar() è un’altra funzione molto utile, che permette di avere a disposizione l’avatar che l’autore ha impostato sul proprio profilo Gravatar. Se non l’ha fatto, l’immagine verrà sostituita con quella di default impostata in WordPress;
  • the_time() funzione davvero utile per conoscere la data in cui l’articolo è stato pubblicato. Come puoi notare, viene richiamata diverse volte per mostrare le informazioni necessarie. Se vuoi maggiori informazioni a riguardo, ti consiglio (anche stavolta) di andare a leggere il Codex che riporta un elenco molto dettagliato;
  • bones_get_the_author_posts_link() come ti ho suggerito qualche articolo fa, partire da uno starter theme aiuta (parecchio). In questo caso sto utilizzando una funzione messa a disposizione da Bones, che mi permette di creare un link alla pagina archivio dei post scritti dall’autore. Se vuoi utilizzare la funzione nativa di WordPress, puoi farlo sostituendola con get_author_posts_url(), ma sarai costretto a creare la struttura HTML che conterrà il link stesso; con la funzione offerta da Bones hai già tutto pronto all’uso 😉
  • get_the_category_list() è una funzione che permette di creare la lista delle categorie, all’interno delle quali è stato inserito l’ articolo. L’unico parametro (opzionale) che ho inserito nel codice identifica il separatore (la stringa di caratteri che separa fra loro i nomi delle categorie) ma, a parte questo, è una funzione molto intuitiva.

Dopo tutte queste spiegazioni, andiamo un attimo a vedere come viene visualizzato il codice che abbiamo scritto. Ti basterebbe tornare in cima alla pagina, ma per evitarti di perdere il segno, ecco qua un semplice screenshot 😉

La Author Box di wpAndMore

Non voglio soffermarmi sulla qualità grafica di questa area (anche se a me piace in particolar modo), perché sappiamo bene che è possibile personalizzare il risultato tramite i nostri fidati fogli di stile (o meglio ancora utilizzando SASS 😉 ), ma questo esempio è servito a mostrarti quanto semplice sia la creazione di una Author Box.

Andiamo adesso a capire come fare qualcosa di ancor più interessante: aggiungere dei campi personalizzati, che potranno essere compilati dai nostri autori.

Aggiunta Campi Personalizzati in un Profilo Utente

Dal punto di vista di WordPress un autore è in primo luogo un utente del CMS, anche se alcuni utenti non scrivono neanche un articolo (come per esempio gli amministratori, anche se queste sono più che altro questioni di sicurezza).

Prima ti ho detto che con get_the_author_meta('googleplus') stavo andando a richiamare un campo personalizzato che viene aggiunto dal plugin WordPress SEO by Yoast. Supponiamo che per motivi vari tu non voglia aggiungere questo plugin, ma desideri piuttosto aggiungere personalmente questo campo (sopratutto in questo periodo, in cui l’Authorship è sempre più importante): come fare?

Il processo non è assolutamente difficile: per modificare la tua installazione di WordPress potresti utilizzare un plugin sviluppato appositamente, oppure inserire il seguente codice direttamente nel tuo functions.php. Io preferisco la prima soluzione, ma dato che su questo sito non abbiamo ancora trattato l’argomento ed i suoi vantaggi, andremo direttamente a lavorare sul file functions.php, che dovrebbe essere presente in qualsiasi tema WordPress (se nel tuo non c’è, non devi far altro che crearne uno vuoto 😉 ).

Cerchiamo di capire per un attimo che cosa stiamo facendo.

Per prima cosa devi sapere che questa non è l’unica porzione di codice che devi aggiungere al tuo functions.php: grazie a queste righe potrai popolare il profilo del tuo utente con un nuovo campo, ma WordPress non saprà ancora cosa farsene dei valori inseriti al suo interno (non preoccuparti: ci torniamo a breve).

In questo contesto ci stiamo agganciando a due Action Hook presenti nel CMS, che ci permettono di iniettare all’interno della pagina del profilo del singolo utente il codice contenuto nella funzione wpam_campi_personalizzati() . Se non sai come funzionano gli Hook in WordPress ti consiglio di leggere questo mio precedente articolo.

Se il tuo desiderio è quello di aggiungere più campi, tutto quello che devi fare è copiare ed incollare l’elemento <tr> e tutti quelli in esso contenuti, ovviamente ricordandoti di personalizzare i vari attributi, per fare in modo che WordPress sia in grado di distinguerli.

Ora che sai come creare i singoli campi, è giunto il momento di farli riconoscere anche a WordPress, per permettergli di salvare i valori all’interno del database, in modo da poterli richiamare dove desideri, esattamente come è già successo per get_the_author_meta('googleplus').

Questa volta utilizziamo degli Hook specifici che vengono attivati in fase di salvataggio del profilo. Giusto per essere sicuri che il profilo non venga modificato da terzi, controlliamo che l’utente che sta inviando queste modifiche abbia il potere di farlo, tramite la funzione <a title="Pagina del Codex relativa alla funzione current_user_can()" href="http://codex.wordpress.org/current_user_can" target="_blank">current_user_can</a>().

Fatto questo controllo, non ci resta che richiamare la funzione update_usermeta() al cui interno  specifichiamo il campo per il quale desideriamo salvare il valore.

Ricorda di richiamare la funzione update_usermeta() per ciascun campo che viene dichiarato nella funzione wpam_campi_personalizzati().

Complimenti! Hai appena creato il tuo campo personalizzato e potrai richiamarlo nelle pagine dei tuoi articoli grazie alla funzione get_the_author_meta(), di cui abbiamo discusso precedentemente.

Come Creare una Author Box tramite un plugin

Adesso hai tutte le conoscenze necessarie per creare la tua author box personalizzata. Tutto quello che devi fare è utilizzare le funzioni che abbiamo visto per richiamare le informazioni degli utenti che desideri e personalizzare il tutto con i fogli di stile.

Ma come ti ho detto in precedenza, se non hai voglia di immergerti nel codice, esistono anche dei plugin che possono aiutarti.

Personalmente non sono un fan di queste soluzioni semplici: se sei uno sviluppatore, credo che anche tu preferisca avere il pieno controllo del codice… Ma se stai leggendo questo articolo e alla lettura dei frammenti di codice ti sono venuti i capelli ritti, mi sembra doveroso offrirti una soluzione “pronta all’uso”.

Un Esempio di Author Box

Quello che vedi nell’immagine qui sopra è il risultato che ottieni utilizzando il plugin Fancier Author Box. Personalmente non l’ho mai provato (anche perché come sai – quando posso – preferisco andare di codice 😉 ); ma è molto utilizzato e molti blogger lo usano con grande soddisfazione.

Il plugin, già nella sua versione base, ci permette di richiamare in modo automatico il nome, la descrizione e tutti i contatti social dell’autore di turno. Oltre a questo puoi anche far inserire al tuo utente altri social network e presentarli come semplici icone posizionate direttamente sotto il suo avatar.

Conclusioni

Ebbene sì, siamo giunti alle conclusioni! Prima di fare un piccolo riassunto vorrei ringraziare Renzo Alvau e la sua discussione all’interno della community WordPress Italy+, che mi ha ispirato nella scrittura di questo articolo dal quale spero tu possa trarre beneficio 😉

Con i codici ed il plugin appena presentati dovresti ormai essere in grado di implementare un author box come meglio credi… la scelta ora è tua, perché la mia la conosci già eheheheheheh

Mi permetto di chiederti un piccolo favore: se ti è piaciuto questo articolo, mi farebbe veramente piacere se tu lo condividessi un po’ in giro. Semplice e diretto vero?

I motivi ormai li dovresti conoscere, ma se così non fosse, lasciati dire che mi aiuteresti moltissimo a far crescere questo sito e che te ne sarò eternamente grato 😉

Lascia il tuo Pensiero