How to: make your new posts stands out

December 7, 2008 at 8:27 am

Why not giving a special style to the posts published less than 24 hours ago, to let your readers know about the fact they’re new? Here’s a simple code to do it.

To achieve this recipe, edit your index.php file and look for the loop. Replace it with that one:

<?php if (have_posts()) : ?>
    <?php while (have_posts()) : the_post(); 
        $currentdate = date('Y-m-d',mktime(0,0,0,date('m'),date('d'),date('Y')));
        $postdate = get_the_time('Y-m-d');
        if ($postdate==$currentdate) { 
            echo '<div class="post new">';
        } else {
            echo '<div class="post">';
        } ?>
        <a href="<?php the_permalink() ?>" rel="bookmark">
        <?php the_title(); ?></a>
        <?php the_time('j F Y'); ?>
        </div>
    <?php endwhile; ?>
<?php endif; ?>

The above code will add the css class new if the post was published less than 24 hours ago. Then, you just have to modify your stylesheet a bit:

.post{
    /* CSS style for "normal" posts */
}

.post.new {
    /* CSS style for newer posts */
}

Thanks to Fred jaillet for the recipe!

Tags: