How to Add New Class to First Post in The Homepage
31st Jan 2011 | Posted by reza | 8 CommentsSometimes, wordpress theme developers or users want to make their latest post looks different from the rest for their theme. Maybe they want to make the font larger, or the background color lighter, or whatever. This can be done by adding new class to the latest post and then styling the class via css. Here, I’ll share the trick to add that new class.
But before that, you may also be interested in the following wordpress quick tips related articles:
-
How to Display Most Popular Posts from a Specific Category
What if the popular posts we want to display are from a single category only? -
How to Order Categories by Most Recently Updated
Tips for reordered your category list based most recently post updated in that category.
How To Add New Class to First Post in The Homepage
On standard themes, usually using post_class() function to create post classes. We need a filter so this function on the first post has a special class. Ok, Add this code in the function.php
function firstpost_class($class) {
global $post, $posts;
if ( is_home() && !is_paged() && ($post == $posts[0]) ) $class[] = 'firstpost';
return $class;
}
add_filter('post_class', 'firstpost_class');
Now, the first post has new class, ‘firstpost’ and we can style the latest post by using this class.
Hope this hack help
7 Comments to “How to Add New Class to First Post in The Homepage”
Add Comments (+)-
Michael says: OH MY GOD…. Dude thanks so much…. I have been working on trying to get the first post styled…. you just saved my ass.
-
Nice post dude…Can i know how to display posts with separate categories headings as in wordpress movable theme in the homepage.
-
Did not work for me. There was no error, but nothing changed. Is there I need to modify in my index.php?
Thanks…
-
Hello! Congratulations for your post. I would like to know if is possible to apply your code not only for the index, but also on single page or post page (post view). My problem is the following: on header.php the last element is a “” and for each post there is a “border-top”, so, when I view a single page for example, above the post appears 2 “borders”, in otherwise, the look is so bad! How can I solve that?
Thank you.
-
Mohamed Samir says: Thank you Very much, You just saved me, I’ve been searching for this for other 3 months (not joking)
error message, last }
Parse error: syntax error, unexpected ‘}’