Styling the first post (6 posts)

  1. jimmytubbs
    Posted 6 years ago #

    I want to style every first post that comes on my main page and then another style for every other post that comes after.

  2. Clayton James
    Posted 6 years ago #

  3. Mark / t31os

    Posted 6 years ago #

    This will likely be done in your theme's index.php ...

    <?php if (have_posts()) : while (have_posts()) : ?>
    <?php while (have_posts()) : ?>

    Update that to...
    <?php if (have_posts()) : $postCount = 1; while (have_posts()) : $postCount++; ?>

    Then find where you post element starts...

    Here's an example:
    <div class="post" id="post-<?php the_ID(); ?>">

    Now update that to..
    <div <?php if($postCount == 1) { ?>class="specialclass"<?php } else { ?>class="post"<?php } ?> id="post-<?php the_ID(); ?>">

    All posts except the first will have the usual post class, the first will have "specialclass", but you can change the name to whatever you want...

    Hope that helps.. :)

    NOTE: If on the first part you only had.
    <?php while (have_posts()) : ?>

    You'll then also need to update this area...
    <?php endwhile; ?>
    <?php endwhile; endif; ?>

  4. Clayton James
    Posted 6 years ago #


    hee.. hee.. I beat you to your own answer.


  5. Mark / t31os

    Posted 6 years ago #


    At least i know i'm not going mad when i wonder if i've answered the post count question before... :)

    Although the whole point of the post class is so you can style individual posts etc...

    Whatever works though... :)

  6. maorb
    Posted 6 years ago #


    I tried this solution and it works fine, but with one problemm - when you navigate to page #2, the first post there gets also the special class.
    How could that be avoided?

Topic Closed

This topic has been closed to new replies.

About this Topic