Do you want to add Odd and Even classes to posts in your WordPress theme? Adding an odd and even class allows you to style every other post differently. In this article, we will show you how to add odd/even class to your post in WordPress themes.
Why Add Odd/Even Class to Your Posts in WordPress Themes?
Many WordPress themes use an old or even class for WordPress comments. It helps users visualize where one comment ends and the next one begins.
Similarly, you can use this technique for your WordPress posts. It looks aesthetically pleasing and helps users quickly scan pages with lots of content. It is particularly helpful for homepage of magazine or news websites.
Having said that, let’s see how to add an odd and even class to your posts in WordPress theme.
Adding Odd/Even Class to Posts in WordPress Theme
function oddeven_post_class ( $classes ) {
global $current_class;
$classes[] = $current_class;
$current_class = ($current_class == 'odd') ? 'even' : 'odd';
return $classes;
}
add_filter ( 'post_class' , 'oddeven_post_class' );
global $current_class;
$current_class = 'odd';
This function simply adds odd to the first post, then even, and so on.
You can find the odd and even classes in your site’s source code. Simply take mouse to a post title and then right click to select Inspect or Inspect Element.
.even {
background:#f0f8ff;
}
.odd {
background:#f4f4fb;
}
So that’s it for now, Hope you guys like this. We will come up with another blog post soon. Contact us for any query. Follow us on Facebook
