WordPress Post Thumbnails

November 24th, 2007
Cool Scripts, LinkyLoo, WordPress Hack

Giving each WordPress post a thumbnail, and display the thumbnail on the home page: Interesting tutorial on creating thumbnails for each post on your blog and using Custom Fields to add and display them on your front page. A word of warning: the process is hand crafted and labor intensive. Think of them as SnapShots for your WordPress posts, hosted on your own blog. I think this could be a very cool plugin that automagically builds thumbnails for your posts and stores them on your blog. Then a custom function that behaves like “recent posts” could display thumbnails of your posts on the front page. I see this feature being really useful for those who post a lot of multimedia such as videos and pictures. Thanks HackWordPress
[EDIT] Also, check out another Custom Fields thumbnail tutorial.




  1. Ulf (2 comments.) says:

    Over at my site, I use the Post Thumbs-plugin, which does the same thing, basically (providing that there’s an image in your post). Check it out.

  2. Anirudh (2 comments.) says:

    I’d worked on a similar plugin that i’m gonna release soon. Essentially it looks for a category(assuming posts have single categories) and gives a corresponding thumbnail.

    Great for easily adding a bit of eyecandy.

  3. Audrey (3 comments.) says:

    Precisely what I’ve been looking for all across the board. I was going to just figure it out myself, but sometimes I think there’s a tutorial for everything to do with WordPress. :)


  4. Jenny (28 comments.) says:

    That’s nifty. I’ll have to check it out.

  5. Matt (23 comments.) says:

    Whenever I wanted to do thumbnails for posts, I just placed an image within the loop that had a filename of the post-id, which would look like:

    <img src=”<?php the_ID(); ?>.jpg” align=”left” border=”0″ />

    Then, the only thing you have to do is worry about making the image and uploading it – and not worrying about things like custom fields. Fairly simple.

    Post IDs are found under Manage > ID (it’s the very first column.) So if you wanted to make a thumbnail for post 255, you name the image 255.jpg.

    Simple, right?

  6. Miriam Schwab (6 comments.) says:

    Hi – I’m glad you found my post useful!

    Matt – that’s a pretty smart workaround for posting thumbnails, but I think there’s one drawback (correct me if I’m wrong): a post only gets an ID number once it’s been published. This means you have to write the post, publish it, and then go back and create an image with the ID number in it. So you have to publish, and then edit, no?

  7. Kyle Eslick (1 comments.) says:

    Hi Mark,

    Thanks for mentioning Hack WordPress!

    There are definitely quite a few ways to do this. One of my favorite sites to see this in action is CyberNet News.

  8. Matt (23 comments.) says:

    You wouldn’t have to edit the post, just view what post ID it is. And if you just do nothing but posts, then it goes in order. If your last post was ID299 and you haven’t published anything since, your next post will be ID300. It’s fairly simple, one line of code, and doesn’t involve custom fields (the need to add one for every post), so I figured it’d be a little easier than having to edit something every time you post (it also gives it an ID when you save and continue editing).

  9. Richard Bui (1 comments.) says:

    Ha! That’s funny, I just had this idea a week ago to use the Custom Fields to add post thumbnails. I took it a step further by utilizing pictures posted to flickr using their 75×75 size and also using the Custom Fields to display picture credits. See it on my site at

  10. david (1 comments.) says:

    Good article and good design, but I believe I handled the same things without needing to do any special changes to the code. I wrote a script that feeds directly off of the RSS feed and dynamically creates thumbnails for the posts directly from the images are already part of the article.

    No need for any thumbnail image directory… change the image in a post and the home-page simply changes to match it.

    Take a look at my site

  11. O says:

    This is very cool but it would be cooler if it was a plugin, as you suggest.

  12. CrossX (1 comments.) says:

    thanks this is what i was searching for my blog :)

  13. Justin Tadlock (51 comments.) says:

    I just wrote a tutorial on this last month ( Adding images to posts). No link love for me? :)

    In all seriousness though, this can be a really powerful feature because you can pull these thumbnails out anywhere in your blog. They don’t have to be used along with just the post.

  14. Jeff (27 comments.) says:

    Im a satisfied user of the Yet Another Photo Blog plugin. Handles post images and thumbnails nicely, even allowing simple integration without any theme updates. See for all the details.

  15. aNieto2k (2 comments.) says:

    One year ago I wrote it, it’s a plugin for do it.

  16. tricky (1 comments.) says:

    all this is already supported by the Post Thumb plugin, which does a great job creating thumbs for posts that enable a wide spectrum of usages.


  1. […] into your WordPress theme with custom fields, thanks to everyone’s comments here and on weblog tools collection, who referred to my post. I decided to collect all the links posted in the comments here so that we […]

  2. […] Nov. 27, 2007: This post got a lot of comments here, and on Weblog Tools Collection who referred to it. Lots of people gave more recommendations on how to manage thumbnails with […]

  3. […] Weblog Tools Collection » Blog Archive » WordPress Post Thumbnails […]

  4. […] Nov. 27, 2007: This post got a lot of comments here, and on Weblog Tools Collection who referred to it. Lots of people gave more recommendations on how to manage thumbnails with […]

Obviously Powered by WordPress. © 2003-2013

page counter