WordPress aggiunge le classi CSS ai post tramite la funzione (e relativo hook) post_class()
. Possiamo sfruttare questa funzionalità per aggiungere delle classi dinamiche in base alla posizione dei post nel Loop. Vediamo come fare.
Aggiungete il seguente codice al file functions.php
:
function additional_post_classes( $classes ) {
global $wp_query;
if( $wp_query->found_posts < 1 ) {
return $classes;
}
if( $wp_query->current_post == 0 ) {
$classes[] = 'post-first';
}
if( $wp_query->current_post % 2 ) {
$classes[] = 'post-even';
} else {
$classes[] = 'post-odd';
}
if( $wp_query->current_post == ( $wp_query->post_count - 1 ) ) {
$classes[] = 'post-last';
}
return $classes;
}
add_filter( 'post_class', 'additional_post_classes' );
Le classi CSS aggiunte sono:
post-first
- Primo post nel Loop.post-even
- Post con indice pari.post-odd
- Post con indice dispari.post-last
- Ultimo post nel Loop.