In this tutorial, I’ll show you how you can easily add thumbnails, lead image, and other extras to individual posts in WordPress. These images can be shown on the front page, archives, search pages, etc – but appear outside of the content, giving you full control of their placement and style.
In our previous articles on WordPress hacks, we discussed the incredible flexibility of WordPress, which is one of the biggest reasons for its popularity among bloggers worldwide. Custom fields in particular, which let users create variables and add custom values to them, are one of the reasons for WordPress’ flexibility.
In this article, we’ve compiled a list of 10 useful things that you can do with custom fields in WordPress. Among them are setting expiration time for posts, defining how blog posts are displayed on the front page, displaying your mood or music, embedding custom CSS styles, disabling search engine indexing for individual posts, inserting a “Digg this” button only when you need it and, of course, displaying thumbnails next to your posts
One of the things I wanted to accomplish in the custom fields tutorial series is adding the custom fields to the feed. So, if you’re reading this post through your feed reader, I hope there’s an image at the top of this post. If not, I suppose something went wrong. If you’re not reading this in a feed reader, then I suggest you subscribe to the feed now.
I like using custom fields to define images for my posts, so that’s what this script was built upon. So, the script looks for the custom fields Keys that you define. If that Key has a Value (should be an image URL), the image is displayed with your post.
If there is no custom field used, the script looks for the first image attached to your post. If there is one, then it grabs that image and uses it.
If there are no custom fields used or images attached to your post, the script has the capability of scanning the post for other images or displaying a default image that you’ve set.
If that’s all Greek to you, don’t worry; the readme.html file included with the plugin will explain everything.