On Monday I showed you where the sticky post setting was. Maybe you already knew but I had quite a time locating it and thought I might not be the only one having this problem.
So, you used that setting to make a post sticky and now you’re wondering why it isn’t working properly. Well, you have to add some code to your Main Index template.
WordPress 2.7 includes a new function called Post Class, which makes it easier to style certain parts of the theme. One of the classes used with post class is sticky. So, the template doesn’t know that a sticky post even exists until this new code is added.
You need to add the following code within the Loop. Make sure it is somewhere that makes sense.
<div id="post-<?php the_ID(); ?>" <?php post_class(); ?>> Rest of loop here </div>
Many templates already have code like the following:
<div class="post"> Rest of loop here </div>
If your template has the above code, you can simply replace is with the new post class code. If it doesn’t, I’ve found you can add the new code and leave the code you already have.
If you are now wondering what the loop is, it is the code that makes all of your posts show up on the index page.
In it’s most basic form it looks like the following:
<?php if(have_posts()) : ?> <?php while(have_posts()) : the_post(); ?> // Custom Code Here <?php endwhile; ?> <?php else : ?> <?php endif; ?>
Adding the post class code to this will then look like:
<?php if(have_posts()) : ?> <?php while(have_posts()) : the_post(); ?> <div <?php post_class(); ?>> // Custom Code Here </div> <?php endwhile; ?> <?php else : ?> <?php endif; ?>
The new post class div has been added after the while have posts code and the end div is after the else code.
Adding this will make your sticky posts show up properly. If you want to style the sticky post so it looks different than the rest of the posts, make sure you check back on Thursday for my next article.
If you would like to add this to your templates, but don’t want to do it yourself, contact me and hire me to do it for you. It’s a quick and affordable job.
And finally, if you want to read more about the post class, there is information in the WordPress codex.
photo credit: Ryan Grove
Rajeev Edmonds says
Hi Kim,
This is my first comment on your blog. Your content is great. Absolutely clear and crisp. You are undoubtedly a WordPress Wizard.
When I’ll switch from blogger to self-hosted blog, I’ll take your services :)
–Rajeev
Rajeev Edmonds´s last blog post – How To Get Connected With Famous Bloggers
Tracy O'Connor says
Kim, you are my angel. I am not being funny, this post and the one on Thursday are exactly what I need! Thank you! You need to live near me so I can buy you a drink and dinner! No haggis, quality food all the way!
Seriously, you are the best!
Tracy O’Connor´s last blog post – Yes and Go!
Kim Woodbridge says
@Rajeev – Thanks for visiting. And thank you so much for the compliment! Sometimes I worry that I am not explaining things clearly and you have helped me feel more confident about that.
@Tracy – I’m SO glad that I am writing about something that someone needs and is useful to them :-)
LOL on the haggis. I think we live too far apart for dinner but maybe someday.
Jeff Starr says
Nice! I will be drooling over this post during my free time this week at work. Well done! :)
Donace says
if your back with the realm of living; sweet post….sideline question though how do you display the code?
Donace´s last blog post – Adgitize – A critical look
Kim Woodbridge says
@Jeff – Wow! You made my day. Thank you so much.
@Donace – I’m not sure what you mean by the first part of the comment. I’ve been here – I posted all last week. Maybe you were bored with the posts about books and reading :-P
I use a plugin to help me display the code – Syntax Highlighter –
http://wordpress.org/extend/plugins/syntaxhighlighter/
And then I put the code for that with a blockquote.
Donace says
I meant your earlier tweet
‘kwbridge Ok I’ve just died and gone to heaven if @perishable says well done in the comments for one of my articles :-)’ :p
and no I read those posts as well…just been a tad busy recently; and will check that plugin out :p
Donace´s last blog post – Rapidshare Search Engines
Sommer@greenmom says
Kim, behind on commenting and so forth but I read and learn so much from you. Thanks for what you do. You should be appreciated. I appreciate you!
Sommer@greenmom´s last blog post – Think Baby Stainless Steel Feeding Set: BPA Free and Amazing!
Shirley says
Thanks for the tut. With every new version of WP, I usually stay up to speed by consulting the codex and also looking at the new ‘default’ theme that comes packages with each version. But I haven’t upgraded all of my ‘old’ themes, so thanks for doing all the ‘research’ and eliminating the guesswork. :-)
Shirley´s last blog post – Does Your Blog Need A Makeover?
Andrew Kelsall says
Thanks for the info, I’ll Delicious Bookmark it. At some point, I think Ill add sticky posts to my own blog. BTW, love the top photo!
Andrew Kelsall´s last blog post – Top Ten CD Cover Design Tips
Kim Woodbridge says
@Donace – OK, I’m a little thick. ;-) There is also the question as to whether I would go to heaven …
@Sommer – Thanks!! And I’ve been behind on commenting for like … always ;-)
@Shirley – Ok – you do the global class in the functions to style the new threaded comments because I am having a rough time with that one ;-)
@Andrew – You’re welcome. I’m curious to see how you’ll use it. I can’t imagine who would take the time to stick that many post its in someone’s office but it’s pretty funny … and annoying :-)
Jen says
Really, really cool- I always thought this was a function that only came with certain themes.
I like your writing style- very understandable.
Jen´s last blog post – Google Adwords Income- Using PPC Domination to Generate Leads While Making Money
Kim Woodbridge says
@Jen – Thank you for visiting and commenting and thanks for the compliment.
Themes that have been designed specifically for 2.7 will have this feature already built in. If we want our current themes to be able to utilize it we have to add it in ourselves.
Nihar says
Kim, Nice tutorial, I will do this first and then create a stick post and check it.
I have to then style it to make it stand out different from the rest of the posts.
Thanks!
Nihar´s last blog post – How to Add WordPress pages to Nav Bar
Kim Woodbridge says
@Nihar – My article tomorrow is going to explain how to style it :-)
Nihar says
@Kim, I am looking forward for your next post on this topic.
Looking at the code above. I see that there is problem. I may be wrong.
tag is in else part. I think it should be just before endwhile.
what do you think?
Nihar´s last blog post – Browser stops working after starting uTorrent client
Kim Woodbridge says
@Nihar – Do you mean the end div tag? You’re right – thank you so much for catching that. I’m fixing it now.
Shirley says
Haha. Yeh… I think I’ll just link out to external tutorials for that one. ;-)
That was not a fun theme upgrade. Funny, I ugraded my theme for threaded comments, but after using it for a day, I decided that I didn’t want it. I think that I might just opt for the threaded comments plugin which is better than the WP default threaded comments.
Shirley´s last blog post – Your FeedBurner Subscriber Count Is Not Accurate
Tawny Press says
I just want to say, great photo! That was my desk before I found a digital way to take notes. LOL
Tawny Press´s last blog post – TweepSearch for Twitter
Kim Woodbridge says
@Shirley – If you find a good one let me know. I’m looking for something for non-techie types and haven’t located one yet. I’m thinking I’m going to have to figure it out and write one myself.
Do you have a recommendation for a good threaded comment plugin?
@Tawny – LOL I can’t imagine who did that to the office. There’s another photo on flickr of a car completely covered in post-its.
Mark Cahill says
On a similar idea, you might want to cover WP 2.7 threaded comments. Again, the control is somewhat buried, and some theme changes are also required. Excellent post!
Mark Cahill´s last blog post – The Little Things – Executing a Presidential Site Update
Kim Woodbridge says
@Mark – Thanks! The thing is I have to get mine working and styled correctly before I can write about it ;-) It is slowly starting to sink in.
Nihar says
Yes kim, i was talking about the same.
Nihar´s last blog post – How to Access Gmail Offline using Google Gears
Carla says
Great series! I just composed a sticky post, but it does show up without the special codes. Do I still need to make any changes to it?
Carla´s last blog post – Blogroll – 1/29/2009
Kim Woodbridge says
@Nihar – Thanks again.
@Carla – No, if it’s working than it’s fine. Now I have something to investigate. Perhaps without this code than it can’t be styled.
Scott says
Hi Kim,
I’ve been looking for an answer to why my stickies don’t work. I’m no code genius So I was hoping you could fix this to make stickies work:
have_posts()) : $recent->the_post();?>
at
ID, “thumbnail”, true) ): ?>
<a href=”” rel=”bookmark”><img style=”float:left;margin:0px 10px 0px 0px;” src=”ID, “thumbnail”, true); ?>” alt=”” />
<a href=”” rel=”bookmark”><img style=”float:left;margin:0px 10px 0px 0px;” src=”/images/thumbnail.png” alt=”” />
<a href=”” rel=”bookmark”>
Thanks for any help,
S
Scott says
that code didn’t post correctly I’ll try again:
have_posts()) : $recent->the_post();?>
at
ID, “thumbnail”, true) ): ?>
<a href=”” rel=”bookmark”><img style=”float:left;margin:0px 10px 0px 0px;” src=”ID, “thumbnail”, true); ?>” alt=”” />
<a href=”” rel=”bookmark”><img style=”float:left;margin:0px 10px 0px 0px;” src=”/images/thumbnail.png” alt=”” />
<a href=”” rel=”bookmark”>
Scott says
nope, I’ll try to send in an email.
Kim Woodbridge says
Hi Scott – Sorry about the problem adding the code to the comments.
I’ve had providing instructions for that on my todo list. I received your email and just replied.
Kushagra Agarwal says
Thank you…. It worked for me like charm and I styled the sticky post. Now is looking gr8
.-= Kushagra Agarwal´s last blog ..Microsoft: Breaking up with IE 6 hard to do =-.
Kim Woodbridge says
Hi Kushagra – Excellent! I’m glad it worked for you.
Nic Penrake says
Kim, hi can you explain where I’d find the ‘Main Index template’? What is it called and whereabouts would I have to post the code you wrote out for us? And is this code up to date with WordPress 3.1 or even .2? Thanks, Nic
Kim Woodbridge says
Hi Nic – It should be Appearance > Editor > index.php
The main loop differs depending on the template but it should always have something that looks like this
?php while(have_posts()) : the_post(); ?