24 Stile per i post
Gli stili dei post, sono tutti gestiti da single.php.
Immettete i template tag post_ID() e post_class(), all’interno del contenitore div.post, come indicato di seguito:
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>> <!-- L'output del post va qui --> </article>
Il template tag the_ID() restituisce l’ID del post, assegnando al contenitore div l’ID di post-X, dove X è l’ID restituito. Questo è un modo di utilizzare un post specifico e far sì che si comporti come volete. L’ID 74 vi fornirà un tag div con id=”post-74″. Assegnategli lo stile desiderato.
È sicuramente più frequente voler assegnare stile differente ai post che appartengono a una determinata categoria. Naturalmente potreste verificare questa evenienza utilizzando un tag condizionale e un breve segmento di codice PHP, ma a farlo ci ha già pensato post_class(). Il template tag restituisce una riga di classi a cui assegnare lo stile desiderato, in base alla posizione del post e così via.
Innanzitutto otterrete anche l’ID del post come classe, quindi il vostro post con id=”post-74″ avrà anche la classe post-74. Otterrete anche ogni categoria a cui appartiene il post, con category- davanti allo slug della categoria. Pertanto, una categoria denominata Website Event, che in genere ottiene lo slug website-event, restituirebbe la classe category-website-event da post_class().
Lo stesso vale per i tag. Se si contrassegna qualcosa con “funny”, i risultati verranno restituiti come classe tag-funny.
Otterrete anche le classi post che si assicura che post_class() sia compatibile con i temi di WordPress precedenti, che in genere descrivono i contenitori <article> per i post con la classe del post, e hentry che indica che il tag <div> appartiene a una voce.
Potrete così cambiare lo stile della categoria, che è probabilmente l’uso più comune per queste classi.
Supponete di avere una categoria di notizie denominata News, con lo slug news. Otterreste così class=”category-news” da post_class() a ogni utilizzo. Supponete inoltre di volere che i link di questa categoria siano verdi: perché non collocare un bordo verde anche sul lato sinistro, per renderlo davvero evidente? Questo obiettivo si può ottenere facilmente:
.category-news {
padding-left: 20px;
border: 5px solid green;
border-width: 0 0 0 5px;
}
.category-news a { color: green; }
Ora ogni post che appartiene alla categoria News avrà link verdi e un bordo verde a sinistra.
È una funzionalità eccezionale, perché le categorie possono essere utilizzate per controllare elementi di design e i tag per ordinare ulteriormente i post.
Per esempio, potrei disporre di un tag per My Fav, una caratteristica in esecuzione. Ogni post che fa parte dei preferiti disporrà di un’immagine My Fav nella parte superiore destra, che funge da contrassegno per far sapere agli utenti che è uno dei miei preferiti:
.tag-my-fav {
background: url(myfav.gif) top right no-repeat;
}
Questo darebbe come risultato un’immagine di sfondo, myfav.gif, nell’angolo superiore destro ogni volta che post_class() restituisce il tag con lo slug my-fav.
Infine potete passare una classe specifica a post_class(). Volete aggiungere la classe stars ai singoli post? In tal caso, modificate il codice post_class() nel template file single.php come riportato di seguito:
<article id="post-<?php the_ID(); ?>" <?php post_class( 'stars' ); ?> >
Similmente quando dovete mantenere uno stile specifico dei post attraverso post_class(), che però agisce all’esterno del loop, dovete indicare a post_class() di restituire l’ID:
<?php post_class('',$post_id); ?>
post_ID() consente di aggiungere uno stile fisso a un post particolare, ma post_class() è più utile, dato che vi permette di applicare sia stili a serie di post che anche al singolo post.