Codeable info

How to Make a Post Sticky in WordPress

Posted on by in WordPress Tutorials

Do you ever become frustrated when you visit a blog repeatedly and the same post always appears at the top of the page?  Do you wonder why the writer is not updating their blog? Well, you don’t have to be confused any longer. This phenomenon is actually a common scenario on WordPress blogs and has a legitimate purpose behind it.

A popular feature in WordPress is the ability to make a blog post “sticky”. A sticky post is one that remains at the top of the blog post page long after it has been published. Typically, the newest blog post is added at the top but moves down as you post new articles. However, a sticky post will always stay at the top until you switch it out.

Why Make a Post Sticky?

There are a number of different reasons why you might want to make a post sticky. A sticky post may be a favorite article that you want to make sure that readers see, a post that has received a great deal of traffic, or a post highlighting a time-sensitive issue. It is advised that you only have one or two sticky posts at the top of the blog post page or some readers may mistakenly think that you have not updated your blog in awhile and move on.

Enabling Sticky Posts in Your WordPress Template

The sticky post feature is available in WordPress 2.7 and every newer version.  However, the option will not show up automatically.  You must manually add it into the code. You must also realize that you need a “sticky-compatible” theme in order for the feature to work properly.  Many people are not aware that many of the most popular WordPress templates are not “sticky compatible.” However, it is quite simple to alter any WordPress theme to accommodate sticky posts, as long as you are willing to do some HTML/CSS editing. Follow these easy steps to enable this feature:

Within the post loop, you should see code that looks similar to this:

<div id="post-<?php the_ID(); ?>">
Rest of loop here
<div>

To update the theme, you simply need to replace class=”post” with the post_class function. Your code should now look like this:

<div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
Rest of loop here
<div>

Adding Style to a Sticky Post

You will also want to style to your new sticky class. There are numerous ways that you can do this, but simply adding a background color is often sufficient. Here is an example of how you would add a yellow background, a margin at the bottom and a thin black border around your posts:

.sticky {
background:#fff8dc;
border: 1px solid black;
margin-bottom: 7px;
}

How to Make a Post Sticky

Follow these simple steps to mark a specific post as sticky in WordPress:

  • Log into your WordPress Admin tool.
  • If you are creating a new post or editing an old one, the option to make a post sticky is under the ‘Publish’ panel on the top right side of the editor application.
  • Click on the ‘Edit’ button next to ‘Visibility’.
  • Check the box next to ‘Stick this post to the front page’.
  • Click ‘Save’ or ‘Update’.

One More Way to Make a Post Sticky

If you want to make a post sticky that has already been published, there is a quicker way to do this. Go to the ‘Posts’ list on your admin page. When you put your cursor on a post in the listing, a ‘Quick Edit’ feature will pop up. The ‘Quick Edit’ feature allows you to manipulate several post settings without actually entering into the full post editor screen. At the bottom right hand side of the screen, under the ‘Status’ section, there is a ‘Make this post sticky’ box. Check this box and click update to make the post sticky.

After you have made a post sticky, they are easy to identify if you ever want to change the settings on the post again.  When you are in the ‘Posts’ list on the admin screen, sticky posts are marked with a bold ‘Sticky’ tag. Keep in mind that sticky posts will always remain at the top of your blog post list until you change the settings. It is usually a good idea to put a disclaimer like:

This is a sticky post, newer posts appear below’ at the top of your blog so readers will know that you continue to update your blog regularly.

)
Codeable info

Comments (6)

Comment by Frank Houston says:

Thanks Lisa,
I was looking for a way to create a good looking intro on one of my websites. Your article was very easy to follow and the solution was on point.

This created a nice header and separated the text into paragraphs just the way I wanted it to appear.

Much thanks.

Comment by Michael says:

Hi,

Thanks a lot for this easy method! I’ve just used it on my website!

Happy new year!

Comment by swapnil says:

Thank you for giving this article. It helped me in keeping my post sticky.

Comment by Momagement says:

Thanks for this post – I didn’t realize I could do this so easily in WordPress. I have old content from an old blog I want to upload but not necessarily feature front and center when I do. So I’ll make another recent post sticky so they don’t show up at the top. Perfect. Thanks!

Comment by Indian Weddings says:

Thank you.

Couple of questions:
1] I made 2 posts “STICKY”, but only one appears. Is there any way of making multiple posts “STICKY”?

2] There are two entries for the sticky post. One on top of the page and the other where its original location was. How does one show only one post?

Thank you once again.

Comment by Morio says:

I see post_class() not outputing the ‘sticky’ class in wp 3.2 .resulting to using a filter

Codeable info