WordPress added something called sticky posts way back in version 2.7. People familiar with online discussion forums will recognize the lingo; it is basically something that sticks to the top of the post listing at all times. No matter how many new posts are added, the sticky post remains the first item at the top of the listing of posts. In the Edit Post screen, you can set a blog post to sticky, hence making it stay on top at all times on your site. If two or more posts are sticky, they will all appear at the top of the list, in chronological order. When you remove the sticky setting from the Edit Post screen, the post will automatically sort itself into place with the others.
There is a sticky_class() template tag to output the sticky post class, but with the addition of post_class(), it really isn’t very useful: <div id=”post-<?php the_ID(); ?>” <?php post_class(); ?>> The lovely post_class() template tag adds a number of classes to the post, depending on the details of the post. This is very useful for a designer.
If the post is marked as sticky, post_class() will add a CSS .sticky class. That way, you can alter it any way you want. January be you want it to have a light gray background, larger type, or something else? Just add the necessary styles to your style sheet, applying them to the .sticky class as in the following example:
.sticky { padding: 15px; background: #eee; border: 1px solid #bbb; color: #444; font-size: 18px; }
This above CSS code would put the sticky post in a light gray box with a slightly darker frame and 18-pixel-sized default font size. Here it is in action, within a basic loop:
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?> <div id=”post-<?php the_ID(); ?>” <?php post_class(); ?>> <h2> <a href=”<?php the_permalink(); ?>” title=”<?php the_title_attribute(); ?>”> <?php the_title(); ?> </a> </h2> <?php the_content(); ?> </div> <?php endwhile; else: ?> <p>Some error message or similar.</p> <?php endif; ?>
In plain HTML, you’d get the following containing div. Notice the classes applied by post_ class() in particular: <div id=”post-1″ class=”post-1 post type-post status-publish format-standard sticky hentry category-uncategorized”> <!–POST CONTENT GOES HERE –> </div>
Want to do more with sticky posts? The conditional tag is_sticky() will help you do some funky stuff. January be you really want to rub in the importance of this post above all others? Then why not say so:
<?php if ( is_sticky() ) echo ‘Super important post! Read it! Now!’; ?>
A bit over the top, of course, but there may indeed be times when it is a good idea to output or change things if there is a sticky post involved.
Say you sell e-books on your blog; you could use sticky posts to promote your latest one: <?php if ( is_sticky() ) echo ‘The latest e-book release by yours truly’; ?>
Not all themes support sticky posts visually, and the functionality is a bit hidden in the admin interface, so keep that in mind when building around the sticky post feature.