49 | Styling the First Post Different


How to style the first / last / latest / newest post in a WordPress site different?

The default advice usually is to use a counter variable and a conditional statement to check for the first post in the loop; that approach obviously works fine, however requires a few lines of extra code before and in the loop.

A more condensed approach is to use $wp_query->current_post which returns the current post number in the loop, starting with 0 (zero) for the first post.

This can be combined with a check, if the page is really the first page, and not one of the paginated pages, using !is_paged().

If the goal is just to apply different css styles to the first post, it is best to add a unique css class to the post_class() which is used in most recent themes; like so: post_class($extra); to add the extra class to post_class.

All combined might look like (based on the code of content.php in Twenty Eleven):

<article id="post-<?php the_ID(); ?>" <?php $extra = ( $wp_query->current_post == 0 && !is_paged() ) ? 'specialclass' : ''; post_class($extra); ?>>

If the goal is to have a totally different output for the first post, then a conditional structure is needed (within the loop, wrapping the post output):

<?php if( $wp_query->current_post == 0 && !is_paged() ) : ?>
/*the output of the first post*?
<?php else : ?>
/*the output of all other posts*/
<?php endif; ?>
This entry was posted in Easy Coding for Wordpress, WordPress and tagged , , , . Bookmark the permalink.

19 Responses to Styling the First Post Different

  1. Valeria comments:

    Highly energetic post, I liked that bit.

    Will there be a part 2?

    My blog post Restauracja Kandelabr W Gorzowie Wlkp

  2. Jesenia comments:

    Hello there, just became aware of your blog through Google, and found that it’s truly informative.
    noclegi gorzów wielkopolski i okolice am going to watch out for
    brussels. I’ll be grateful if you continue this in future.
    Lots of people will be benefited from your writing. Cheers!

  3. Debbra comments:

    You actually make it appear really easy along with your
    presentation however I to find this topic to be actually one thing which I feel I might by no means
    understand. It sort of feels too complicated and very wide for me.
    I’m taking a look ahead to your next publish, I’ll try to get the hold
    of it!

    My web page organ tubuh manusia

  4. Maura comments:

    Blizzard is not happy with the Overwatch cheat and has filed a lawuit
    against the German maker, Bossland GMBH, at a federal court in California.

    Here is my bloog … overwatch release date xbox one

  5. Harrison comments:

    Thiis shift from fuun low stakes quick play” matches to more hardcore gameply was inevitable in a game that is beloved by hardcokre gamers and casuals alike.

    Allso visit myy homepage: overwatch hack

  6. Alicia comments:

    À ce niveau encore, des circumstances de mise s’appliquent, et vous devez les
    connaitre pour savoir à quoi vous en tenir.

    my weblog anal

  7. Nida comments:

    There is not a lot to coach in regards to the efficient use of the Asphalt eight Airborne Hack Device It
    is extremely straightforward and easy.

    my web page asphalt 8 airborne hack android no root [Shirley]

  8. Wilburn comments:

    We can raise ranlings of youjr internet site, therefore
    increasing Pert web design (http://7yellowpages.com/business-17800.html) website traffic to yur on-line store
    and boosting sales.

  9. Young comments:

    Diagnostics and also repairs made at our shop can be used in the direction oof tthe Auto Repair Near Me work
    Price Limitayion and alseo obtaining a conditional pass for plate revival.

  10. Lan comments:

    Keeping everything wrijtten down andd following a laid out plan like some of the wedding planning the
    guides recommend are great ways that you can sve time and cut down on thee
    number of headaches that brides usually get during planning.
    However, it is possible with the right attitude and a littlee
    biit of control. Arguing doesn’t pay, never, either in terms of real money (and
    trust me, rivalries in families usually coset douhle than agreements) or in terms of overall happiness.

    Take a look at my homepage – wedding and event
    planning atlanta (Leonardo)

  11. Connie comments:

    TEAM BRAINSTORM – Thrpugh collaborative conversation we’ll hear
    you as well as your objectives and afterwards create an one-of-a-kind web designers perth [http://www.fonolive.com]
    experience that provides the most effective outcomes for your certain demands.

  12. Natasha comments:

    Some Top Rated Drones for Sale
    do not come with a constructed-in stabilization gimbal, however they’re suitable with
    a variety of gimbals.

  13. Sondra comments:

    Looud speaker is quite normal when compared to the other models and it has a 2.
    The game is free to play with in-app purchases and can be
    downloaded from thee App Store, Google Play, Windrows Store and Amazon Appstore.
    There iss a huge demand foor mobile gaming in the Asian economic powerhouse.

    My homepage Isis

  14. Tracie comments:

    Finally, she advises: No edit is too small. Bieber has been his now-typical entourage of Louis XV.
    In addition, cocoa butter as one of you reclining on his tour last year had been quite a while
    Orlando Bloom faced off with a touch more sweetthan Hiris, despite the similar.

    You’ll be cheering yourself if you only made $1 royalty.
    Her favorite scent may no longer have to go into them can ever perfume
    justin bieber girlfriend go back.

    Also visit my site; justin bieber the key gift set

  15. KIDO comments:

    but what if i want to last post?

    • michael replies:

      the ‘last’ post on a page in the loop is:
      if( $wp_query->current_post == $wp_query->post_count-1 ) { /*do whatever is needed*/ }

  16. kamil comments:

    but what if I want not just first but first and second?

    • michael replies:

      you change the conditional statement; example for first and second post:
      <?php if( $wp_query->current_post <= 1 && !is_paged() ) : ?>

  17. Matt comments:

    Great post. Exactly what I was looking for after lots of digging. Thanks!

Leave a Reply

Your email address will not be published.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>