How to add a class to the first post in the WordPress loop

If you wanted to add emphasis to the first post in your blog adding this snippet to the functions.php of your WordPress theme will add the class of “first” to your first post.

Instructions
Add this code to your functions.php file.

Comments

3 Replies to “How to add a class to the first post in the WordPress loop”

  1. Another easy way to style the first post differently is using the :first-child selector http://www.w3schools.com/cssref/sel_firstchild.asp
    I ran into some problems with the above snippet because I wanted to use Infinite Scrolling. This snippet applies the “first” class to every first post of each “page” not just to the first post, which may not be what you want.

    1. Agreed – challenge with using CSS pseudo-elements though, is that it only applies for styling purposes – and not for appending JS or similar etc.

Leave a Reply

Your email address will not be published. Required fields are marked *