Personalizzare il primo post di WordPress

ATTENZIONE: questo articolo è più vecchio di un anno, e potrebbe non essere più attuale, sei pregato di tenerne conto.

In alcuni casi può tornare utile, nella gestione di un blog, diversificare esteticamente il primo post.

Cambiare colori, allineamenti e caratteri, aggiungere bordi e tante altre operazioni che si possono fare facilmente, se si ha una classe CSS a cui fare riferimento.

Vediamo allora come inserire una classe CSS al primo post di un loop di WordPress.

Il codice che segue va inserito nel solito file delle funzioni del tema, il functions.php, meglio ancora se si utilizza un tema child.

add_filter( 'post_class', 'primo_post_classe_css' );
 
function primo_post_classe_css( $classes ) {
    global $wp_query;
    if ( 0 == $wp_query->current_post ) {
        $classes[] = 'primo-post';
    }
    return $classes;
}

A questo punto è possibile utilizzare la classe .primo-post nel proprio CSS personalizzato, ed apporre tutte le modifiche che si desiderano.

Considerazioni generali sull’uso di questo snippet:

  1. lo snippet qui sopra è stato testato con WordPress 4.0, con il tema Twenty Fourteen ed altri temi.
  2. con alcuni temi lo snippet è inutile, in quanto alcuni temi inseriscono, bontà loro, una classe CSS che distingue il primo post del loop.
  3. in teoria ci sarebbe una soluzione alternativa, senza l’utilizzo di snippet, che chiama in causa pseudo classi che avevo già affrontato e abbandonato per problemi di compatibilità con qualche browser. Perciò ho pensato che l’uso di una classe CSS vera e propria fosse un sistema più affidabile.
Che ne pensi?
Domande? Suggerimenti?
Lascia un commento…

Condividi se ti è piaciuto!

Condividi su facebook
Condividi su twitter
Condividi su linkedin
Condividi su whatsapp

Maggori informazioni:

Roberto Rota

Roberto Rota

Libero professionista, un "artigiano del web", lavoro nella comunicazione in rete da quando esiste Internet. Mi occupo principalmente di assistenza su WordPress e assistenza e consulenza WooCommerce, seguo la realizzazione di progetti web, in particolare siti di e-commerce, visibilità e comunicazione in rete. Il mio curriculum è su Linkedin, e mi puoi trovare anche su Instagram, FaceBook e Twitter.

CONTRIBUISCI A QUESTO SITO
Se il mio lavoro ti è stato di aiuto,
e vuoi che io continui a publbicare,
contribuisci allo sviluppo di questo sito
con una donazione su PayPal.

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Questo sito usa Akismet per ridurre lo spam. Scopri come i tuoi dati vengono elaborati.

Cerca nel sito:

Assistenza specializzata WordPress e WooCommerce

Altri articoli

Mandami un messaggio

Ciao, come posso aiutarti?