ATTENZIONE: Questo articolo è stato scritto più di due anni fa, quindi le informazioni riportate potrebbero non essere più valide. Ti chiedo di tenerne conto e di segnalarmi eventuali informazioni in merito lasciando un commento in fondo alla pagina. Grazie!

Visualizzare il box autore su WordPress

Se vuoi promuovere la tua immagine personale e il tuo lavoro online, un buon inizio potrebbe essere inserire il tuo nome sotto agli articoli che pubblichi.

Inoltre potresti aggiungere una foto o un’immagine rappresentativa, una breve descrizione e magari anche dei contatti.

Aggiungere un box autore ai tuoi articoli è una modifica abbastanza semplice su qualsiasi blog WordPress.

Per prima cosa devi aggiungere il seguente codice al file single.php del tuo tema.

<div class="box-autore">
 <?php
  global $post;
 ?>
 <?php
  if (function_exists('get_avatar')) {
   echo get_avatar( get_the_author_email(), '80' );
  };
 ?>
 <div class="testo">
  <h5>Autore: <?php the_author_posts_link(); ?></h5>
  <p><?php the_author_description(); ?></p>
 </div>
</div>

Tutto quello che viene visualizzato nel box autore viene caricato automaticamente da fonti esterne, questo rende l’aggiornamento e la manutenzione molto semplice e veloce.

Il blocco di codice riportato qui sopra carica un Gravatar (tramite l’indirizzo email dell’autore), il nome con un link agli altri articoli che l’autore ha pubblicato e la descrizione inserita nel profilo dell’utente all’interno del pannello di controllo di WordPress.

Una volta caricato il codice, non ti resta che implementare il foglio di stile che permette di posizionare bene gli elementi nella pagina e di formattare il testo a tuo piacimento.

Di seguito ti riporto un esempio di CSS per il tuo box autore.

Il foglio di stile presentato di seguito controlla l’allineamento, il colore di sfondo, la larghezza del box e la formattazione del testo.

Ovviamente, sei libero di modificare la larghezza del box e le combinazioni di colori per meglio adattarlo al tema del tuo sito web.

/* .box-autore */
.box-autore {
 background: #efefef;
 width: 100%;
 padding: 25px;
 margin: 0;
}

.box-autore img {
 margin: 0 25px 0 0;
 float: left;
}

.box-autore .testo h5 {
 margin: 0;
 font-size: 18px;
}

.box-autore .testo p {
 margin: 0;
 font-size: 14px;
}

Da tenere presente che il div con classe test serve ad evitare che il testo si sovrapponga all’icona Gravatar.

Se vuoi includere informazioni aggiuntive sull’autore, fai riferimento al Codex WordPress come riferimento per le variabili necessarie.

Autore: Gianluca

Appassionato di informatica fin da piccolo, mi occupo di marketing digitale e sviluppo web. Sono l'ideatore e l'autore di WPlab, sviluppo siti web dal lontano 1999, ho iniziato a utilizzare WordPress nel 2008 e modero con passione la sezione WordPress del Forum GT (adesso Connect.gt). Seguimi su Twitter @wplabit.

Lascia un commento