Display Thumbnails For Related Posts in Wordpress
In this tutorial you’ll learn how to increase pageviews by adding thumbnails to related posts using the popular YARPP plugin and Wordpress custom fields.
The Goal
Before we start, let’s take a look at the result of what we’re building:
The sample above comes from the theme of a new One Mighty Roar blog launching next Monday. As you can see, Wordpress will place a thumbnail and title for each related post it finds. This will add some bonus attention to the posts, and hopefully generate additional pageviews. Sound good? Let’s get started.
Download the YARPP Plugin
The basis for this tutorial is the popular (and well named) plugin “Yet Another Related Post Plugin” or YARPP for short. We’ve used it on this blog right from the start, and it’s great for generating additional traffic for posts in the same subject. Thanks to the plugin’s latest update, we can now build our own template to display results.
Go ahead and download the plugin now if needed. If you’re installing YARPP for the first time and have questions, I’m going to refer you to the official site for more. This tutorial will start assuming that you have it up and running already.
Create a Related Post Template File
You’ll notice that when you install the plugin, it includes a folder of preset templates for a variety of display options. They are a great starting point for learning the ropes, but since what we’ll be doing is relatively simple we can start from scratch. Begin by creating a new file named “yarpp-template-thumbnails.php” in the root of your theme folder. This file will contain the structure of our related posts display.
<?php /* Post Thumbnail Template Author: Zach Dunn (www.buildinternet.com) */ ?> <h4 class="meta">Related Posts</h4> <?php if ($related_query->have_posts()):?> <ol class="related-posts"> <?php while ($related_query->have_posts()) : $related_query->the_post(); ?> <?php //Set Default Thumbnail Image URL's $related_thumbnail = get_post_meta($post->ID, "thumbnail_url", $single = true); $default_thumbnail = 'default-image.jpg'; ?> <li> <a href="<?php the_permalink() ?>" rel="bookmark"> <?php if ($related_thumbnail != "") : ?> <img src="<?php echo $related_thumbnail; ?>" alt="<?php the_title(); ?>" /> <?php else : ?> <img src="<?php echo $default_thumbnail; ?>" alt="<?php the_title(); ?>" /> <?php endif; ?> <?php the_title(); ?></a> </li> <?php endwhile; ?> </ol> <?php else: ?> <p>No related posts found</p> <?php endif; ?>
The code above says that if related posts exist, it will go through each and display the thumbnail image URL stored in the custom field thumbnail_url which has been temporarily saved into the $related_thumbnail variable. If no URL exists there, it will display the contents of the $default_thumbnail. This check keeps posts from being stuck without thumbnail previews.
Feel free to tweak it as needed. This is a stripped down version meant to demonstrate the inclusion of images and text, but there’s really no limit as to how in depth your template can become.
Insert into Single Template
In order to make sure that our related posts show up as intended, let’s manually insert the function into the single.php using the code below. I recommend placing it somewhere under the_content() tag.
<?php if (function_exists('related_posts')){ ?>
<?php related_posts();?>
<?php }?>Put simply, this code checks to see if the YARPP plugin is active, and shows the related posts if so.
Customize with CSS
To keep things simple, we’ll just stack the results so that the thumbnail displays on top and the post title on the bottom. Paste the following CSS into your theme’s stylesheet for a good starting point.
/* Related Posts */
ol.related-posts {clear:both; text-align:center; margin:10px 0px 0px 0px; padding:0;}
ol.related-posts li{width:120px; float:left; display:inline; margin-right:15px;; padding:0;}
ol.related-posts img{clear:both; padding:5px; background:#F7F7F7; border:1px solid #DDD;}
ol.related-posts a{clear:both; display:block; border:none; text-decoration:none;}
ol.related-posts li{font-size:12px;}Activate The New Template
Now that you’ve built a form for YARPP to render the related posts from, you’ll have to let the plugin know that you want to use the template. This can be done from within the plugin’s option panel in the Wordpress dashboard.
Look for the “Display Options” section, and check the “Display using a custom template file” box. This will give you a chance to select the correct template from a dropdown box. If you’ve been following along with my naming conventions, you’ll want to pick “yarpp-template-thumbnails.php” and then save your changes.
Specifying Thumbnail in Custom Fields
The frameworks are in place, but how do you specify what thumbnail a post will use? The solution is surprisingly simple. When you’re editing a post in Wordpress, you’ll notice a section below the write panel titled “Custom Fields.” This is where we’ll paste the URL of the thumbnail to be used for each post.
Once you’ve pasted in the URL of the thumbnail image to use, update the post and then YARPP should show it when displaying related posts. No extra headache involved here.
Grab More Attention
With image previews for each of your posts, there’s a better chance someone might see something that inspires them. To help you get started, I’ve included a ZIP file below that contains my version of the YARPP template. At the very least, it should help you get started with your own ventures.
Have I left anything out? Need clarification on a step? Leave a comment below. Good luck!
Discussion
July 17th, 2009 at 8:10 PM
This looks like a great idea. When I get my new layout done, I’ll have to play around with this for sure.
.-= Bill´s last blog ..Easily rename files with Advanced Renamer =-.
July 18th, 2009 at 7:30 AM
I played around with that for a while and never got it to work how I liked it. Now with your tutorial I can probably get it done. Thanks!
.-= Nicholas Z. Cardot´s last blog ..Fire Up Your Passion for Blogging =-.
July 18th, 2009 at 9:23 AM
thanks for good tutorial, its easy and understandable,but i getting no related post, even though i add three post under same category and tags also named for three post. why it happeing.?? will you reply for this.
]
[* note. i have only three post for now: newly launched blog
.-= sriganesh´s last blog ..photoshop tutorial on retouching =-.
July 18th, 2009 at 10:28 AM
That’s great, all in one place. Thanks.
.-= T-Law´s last blog ..tomaslau: 40 Sources To Download High-Quality Free #Photoshop PSD Stuff http://tinyurl.com/l68 =-.
July 18th, 2009 at 11:56 AM
@sriganesh
I would recommend that you lower the related threshold. By default, it requires something like 5 commonalities before associating posts. If you have a new blog, it’s entirely possible that no posts meet this requirement.
You can do this through an item in the YARPP options panel.
July 18th, 2009 at 3:41 PM
Thanks a lot for this post
I’ve actually never heard of YARPP (I know, I need to catch up).
Shall be giving it a whirl very soon
.-= ElanMan´s last blog ..Create Your First AJAX Request (Part Three) =-.
July 19th, 2009 at 9:20 AM
Brilliant tip Zach! I had actually just implemented something very similar on my soon-to-be-launched redesign when I came across this post. I also added a bit of jQuery so that I could have a conventional list of related posts with one image showing next to the list, and then on mouseover the image changes depending on the link being hovered.
.-= Epic Alex´s last blog ..Site Redesign Preview =-.
July 19th, 2009 at 8:52 PM
This is great! I have never thought of using something like this before in my blogs, but now that I can see how easy it is to implement I might have to add it.
.-= Jake Rocheleau´s last blog ..Getting Inside Web Design Dev with Creator Michael Dunlop =-.
July 20th, 2009 at 12:00 AM
Nice tutorial.
I implemented it with no problem. I give u props for this nice tutorial and will suggest it to others.
Greetz
July 20th, 2009 at 12:26 AM
Thank you for this! Just implemented it on Primer and it works great!
.-= Andrew´s last blog ..Five Terrifying Dinosaurs That Deserve More Attention =-.
July 20th, 2009 at 10:24 AM
Thanks for the tutorial… very interesting and helpful…
July 20th, 2009 at 2:14 PM
Nice, images draw visitors in, and I have been looking for something just like this.
.-= Rob´s last blog ..The Best Search Engine Again – It’s Still Not Google =-.
July 20th, 2009 at 5:36 PM
I have just added thumbnails for related posts to my blog. Thanks for making this so simple!
July 20th, 2009 at 10:08 PM
But filling up custom fields every time is really a headache job.. is there any cure for that??
.-= vinoth´s last blog ..Creating Emergency Boot up Rescue Disk =-.
July 20th, 2009 at 11:04 PM
@ thnaks for the reply and i changer it to 3, even thought it comes. you can see in ma site. and by the way this week i llpost 5 more post. ill try then ill tell u sir.
.-= sriganesh´s last blog ..photoshop tutorial on retouching =-.
July 21st, 2009 at 9:06 AM
Great post thanks, I’m now using it with small adjustments on my site.
.-= Self help blog´s last blog ..How To Lose Weight Without A Diet =-.
July 21st, 2009 at 4:34 PM
Hi Zach, that’s great tutorial. I use ephoto theme from elegantthemes.com. In this theme, I use “thumbnail” custom field by default. will it work for me to change “thumbnail_url” to “thumbnail” basically ?
or how should i mofiy php template ?
Thanks
.-= eddai´s last blog ..Kurdele İşi Klozet Takimi Ornekleri – 2 Yakin Çekim =-.
July 21st, 2009 at 4:50 PM
@Eddai
As long as the “thumbnail” field contains a valid image URL, you should be all set. Just find and replace all instances of “thumbnail_url” with “thumbnail” in the YARPP template. Also, make sure that you update the CSS to reflect the correct size (if it’s different). Good luck!
July 21st, 2009 at 5:50 PM
Yes Zach, did it it really works charm now!
I had requested this feature on elegantthemes forums and had been waiting for a long time until seeing your quite simple tutorial.
Thanks!
.-= eddai´s last blog ..Kurdele İşi Klozet Takimi Ornekleri – 2 Yakin Çekim =-.
July 21st, 2009 at 9:06 PM
excellent!! never realized the templates were in the root of the themes. i was changing/adding template code here in plugins/yet-another-related-posts-plugin/yarpp-templates directory. thanks
July 22nd, 2009 at 5:35 AM
Hey, this is a very cool use of Yet Another Related Post Plugin(YARPP) together with the custom field. Thanks!
.-= Dicky´s last blog ..65 Absolutely Cool And Creative Twitter Backgrounds =-.
July 26th, 2009 at 3:45 AM
Thank you very much. Your hack gave a new, fresh air, at the related posts section of my blog.
.-= Stelios´s last blog ..Παπαδάκης Κωνσταντίνος ή Λυρατζάκι =-.
July 26th, 2009 at 1:51 PM
Thanks, I was just looking for this. Will have to switch WRP for YARPP though.
.-= Martin´s last blog ..Movies 2009-06-22 – 2009-06-29 =-.
July 28th, 2009 at 3:05 PM
Thank you very much for this. Never really considered using YARRP, but thanks to this tutorial I now have related posts at the end of each of my articles and posts!
.-= James White´s last blog ..Controlling www or no www in .htaccess =-.
July 28th, 2009 at 5:45 PM
Zach, this is a great tutorial! I’d like to collect some good examples of such customized related posts “in the wild” to add to the screenshots section of the YARPP website… if you have a site actively using this with nice thumbnails, perhaps I’d like to use such a screenshot.
Linked!
July 28th, 2009 at 6:19 PM
@mitcho
Thanks for writing such a great plugin
! If you’re looking for examples, you can check out our latest blog over at Officeal or take a look at some of those who have commented on this post (They’ve implemented it in a number of ways).
July 31st, 2009 at 7:15 AM
Hmm… Great post. I think it’s very helpful as beginer and as expert
. Thanks
August 6th, 2009 at 7:15 PM
I have a large blog that doesn’t use custom fields. Can your tutorial be modified to use the first image found in the blog post for the thumbnail instead of using a custom field?
August 6th, 2009 at 7:16 PM
@Kelly
That falls outside the scope of this tutorial, however this PHP script should be a good starting point for what you’re looking to do.
August 8th, 2009 at 1:46 AM
I can’t code if my life depended on it. Any chance of a new tutorial or do you do custom work?
August 8th, 2009 at 10:21 AM
@Kelly
There isn’t really much reason to do another tutorial. You can get in touch here, and we can figure something out.
August 11th, 2009 at 5:27 AM
Wow , Great Tutorial ..Thanks for Sharing
I like It 
.-= Husien Adel´s last blog ..9 أسرار تسويقية لمصممي الويب =-.
August 18th, 2009 at 5:33 PM
Excellent tutorial. My blog uses timthumb to resize images to thumbnails… is there way to somehow use that to put it into action with YARPP?
.-= Callum Chapman´s last blog ..Giveaway: 1,000 Full Colour Business Cards! =-.
August 23rd, 2009 at 5:32 AM
regarding Callum’s request, I also wonder if we can display resized images to be displayed in related posts.
as with the default settings, the original images are fetched instead thumbnails.
my site also uses timthumb.
Thanks!
.-= eddai´s last blog ..Çiçekli Havlu Kenarı Örneği =-.
August 26th, 2009 at 7:13 PM
You’ve shared some great info but I’d love to read your feedback regarding Callum and Eddai’s request regarding Timthumb (my site also uses it).
Regards,
Karl
.-= Karl Foxley´s last blog ..CommentLuv For Traffic Generation and Increased Blog Exposure [lbtt] =-.
August 27th, 2009 at 4:44 AM
Hi buddy, thanx for nice post though I had nothing to say but then suddenly I happen to notice that your WP -Super cache is not working
I had similar problem and had to shift my WP site to a dedicated box as shared hosts were not allowing it as WP-SUPER CAChe failed.
Just see page creation time in different browser. I had spent lots of hours to fix the issue but I guess its fault with WP-Super Cache latest versions.
Its actually creating new page on every request.
Solution can be using old version of WP-super cache (if you can) or Run it in “Half Mode” .
If this thing helps you then do say thanks to me
.-= Linux Guy´s last blog ..How to access my Outside (live ip) form inside . =-.
August 27th, 2009 at 11:45 AM
it’s really2 cool
August 27th, 2009 at 12:04 PM
Cool tutorial! I’d love to try this but like what vinoth mentioned, it would be a tedious job to fill up custom fields every time for each related post. It would be cool to have the plugin automatically detect the image, create a thumbnail and resize it using the TimThumb script which my theme also uses.
If that’s not possible with YARPP, maybe you can create a new plugin that does all that?
Anyways, good job with this tutorial and looking forward to more cool tutorials.
.-= Jaypee´s last blog ..Google Certified Ad Networks =-.
August 28th, 2009 at 4:32 AM
I have applied following to my yaarp template and now it fetches thumbnails..change the code in line 23 with the following
<img src="/timthumb.php?src=” alt=”" />
August 28th, 2009 at 4:35 AM
sorry..code does not completely appear..i do not know how to post full code here..
August 28th, 2009 at 5:35 AM
Lots of stuff to do =.=
I just need a simple one
.-= Amazooo´s last blog ..Swine Flu Vaccine Urged For Pregnant =-.
August 30th, 2009 at 6:17 AM
I hope someone will create a free plugin for this, which will also automatically fetch the first image from each of the related posts (and alternately display a default image).
.-= Pallab´s last blog ..Monitor Your Bandwidth Usage With Networx =-.
August 31st, 2009 at 7:15 AM
This is really a helpful plug-in to keep your visitors. But I just noticed that this site doesn’t use it.
.-= Ezuca´s last blog ..70 FREE and Most Downloaded Wordpress Themes =-.
August 31st, 2009 at 10:33 AM
I’ve gotten it to work in the way that it fetches the first image of each related post. Will be putting up a post on that on my site later on.
It is rather simple actually, just search up on how to fetch the first image and then edit the code accordingly.
Thanks for the great idea of putting images besides related posts, never actually thought of that before! Great stuff!
.-= Swift´s last blog ..Happy Teachers’ Day 2009 =-.
September 1st, 2009 at 1:41 PM
Thankyou very much for this article. It has helped me a lot!! You’re great!
September 2nd, 2009 at 9:26 AM
@Jaypee That is possible with an excisting addon:
WP-Choose-Thumb: http://wordpress.org/extend/plugins/wp-choose-thumb/
In this script change on line 16 “thumbnail_url” to “wct_thumb”
Awesome combination =)
(sad thing is, i was using another plugin at first, so have to change all my thumb)
.-= Freakenstein´s last blog ..Dikke Duim voor HTC =-.
September 10th, 2009 at 2:14 PM
what a GREAT, thanks for the thumbnails Bos,pram from Indonesia say Hello, and best wish for you Zach.
.-= info bisnis´s last blog ..Badan Penanaman Modal Kabupaten Banyumas =-.
September 12th, 2009 at 3:00 PM
I’ve tried following your tutorial, but am having issues with it showing up. I’m using the “Atahualpa” theme. I do not have a single.php file, and I think that is the problem that is preventing the related posts from showing up. Where would you recommend inserting that function?
.-= Greg´s last blog ..September 11th, Patriot Day and Baked Macaroni and Cheese =-.
September 12th, 2009 at 3:03 PM
@Greg
You’re going to have a difficult time adding in minor tweaks without a single.php. I recommend you make a single.php based on the index.php page. Then you’ll be able to work in things like this tutorial without any headache.
September 21st, 2009 at 8:36 AM
Hi Zach,
Many templates doesn’t use thumbnails for posts. So I guess it would be nice to add a feature to automatically insert the first image file in posts as a thumbnail image. There is such a plug called linkwithin and I use it on one of my blogs http://www.freemoneyguide.com
.-= bedava´s last blog ..bedava sms: freesms ile bedava sms gönderme =-.
September 22nd, 2009 at 2:28 AM
I am already running a blog without using costume code for posts. Does this plugin grab the first image or do I have to edit all my posts? (it will very difficult to do so, I have almost 800 posts so far).
September 26th, 2009 at 2:43 AM
Awesome tips…
Please make intergration between autothumbnailer with existing custom field
timb thumb:
http://www.darrenhoyt.com/2008/04/02/timthumb-php-script-released/
would be less maintenance and easy to post content without extra effort to post thumbnail images.
sorry for my englsih…
.-= Mansur´s last blog ..Apprecite Beauty =-.
September 29th, 2009 at 11:39 AM
yarpp is worst plugin i have come across
you can check Contextual Related Posts which give u better result, i did testing with only 3 post same topic about the same product in my test blog where yarpp give no related post and Contextual Related Posts give me all the 3 post as Related Posts
September 29th, 2009 at 1:13 PM
@Roger
Sorry to hear that you didn’t have much luck with YARPP, but based on your experience I wouldn’t rule it out so quickly.
I suspect you overlooked some of the settings in the YARPP panel that allows you to set minimum related level. This means that instead of matching posts based on title alone, other criteria (tags, category, etc) must also be present. It helps keep things related on deeper levels, and is a common thing to overlook.
I think it’s a wonderful plugin, and hopefully you’ll give it a second look.
October 22nd, 2009 at 5:30 PM
Maybe windows installed in your house are not as good Sweden but the one I have installed are. ,
October 23rd, 2009 at 12:28 AM
Zach, works great, thanks for the tutorial, If I want to display 10 related posts with 5 in each row, can you suggest the css modifications, i’ve tried changing the css but its not uniform for all posts, i mean in some cases the the related posts in the second row are not in one line, would appreciate your help..
.-= Avinash´s last blog ..Copytrans Manager – Free, Portable iTunes Alternative =-.
October 27th, 2009 at 7:12 AM
just one question: does’t it work if my custom field has already images that are hosted on imageshack?or it works only with images hosted on the site domain?
November 4th, 2009 at 8:30 AM
the zip can never be installed because it has an invalid header….any solution to this? i’ll cordially appreciate it..
.-= Ezuca´s last blog ..Top 20 of the Best Wii Games =-.
November 4th, 2009 at 9:22 AM
@Ezuca
The zip attached is just of source code to be used inside of Wordpress. It is not simply a plugin file to be installed. Sorry for any confusion!
November 8th, 2009 at 3:41 AM
Master Zach, lol.
Is there a way to Customize with CSS, so that the image size will just be 70×70? please..
.-= BryanV´s last blog ..PINOY KALAMAY =-.
November 18th, 2009 at 6:12 AM
Really useful article !
BryanV, I just put a 70×70 image with the thumbnail_url name, and it works. You just need to change the width (in CSS) 120px by 60 or 70 px.
Is there a way to remove the text, and only display the images ?
Thanks.
November 18th, 2009 at 11:45 AM
Is there any way to customize this? Instead of getting the thumbnail image from the custom fields, the script will just get the thumbnail from the first image uploaded in the post? Woooooooot…
November 18th, 2009 at 8:32 PM
Thanks Zach for such a wonderful post, Though earlier I was using link within widgets to show related posts with thumbnail, recently I started using wp-thumbie plugin which picks up the first image from the post to show related post.
November 20th, 2009 at 12:12 PM
$default_thumbnail = ‘default-image.jpg’;
<img src="” alt=”" />
Where should I upload the imge for default-image.jpg ?
Please help..
November 20th, 2009 at 9:58 PM
The images are showing up too big. How to solve this?
November 22nd, 2009 at 12:05 AM
Hi, can you tell me what code can I add to the php file so the thymbnails are resized to lets say 100px x 100px
I’m already using a custom field, but now the pictures are huge and I need to set custom size, please help.
November 22nd, 2009 at 10:40 AM
@Bryan V
Just put the URL of your image there. I recommend using absolute paths to avoid any confusion.
@Inglid and paff
From the looks of it, I don’t see anything in this script that would cause the images to be different sizes. Perhaps some of your theme’s CSS is conflicting? If so, you’ll want to add in styles to specify the size.
November 23rd, 2009 at 1:50 AM
Thx for the tutorial, so far I manage to get thumbnail display on all related post, but need some time to add thumbnail for all older posts.
November 24th, 2009 at 4:19 AM
Anyone know how to diplay only the thumbnails and remove the title of the article ?
Thanks.
November 24th, 2009 at 10:48 AM
Thank you!
There is some problem – I add custom field, write image url, but there is no thumbnails, just text… How to solve this???
December 2nd, 2009 at 6:31 AM
many thanks .. helped me alot
♥
December 2nd, 2009 at 10:03 AM
This is a bit miserable, since i have to add a image every post i make. This makes my time fly away.
At first impression it sounds like the 100% related posts plugin, but it isnt.
December 5th, 2009 at 3:59 PM
This simply rocks and works flawless, I do have one small question though. Is it possible to extend the script somehow to include a line or something from the text within the post, not only the headline? Best of regards
December 8th, 2009 at 6:01 AM
i m using wp-thumbie plugin which does this work..
December 8th, 2009 at 6:01 AM
I m using wp-thumbie plugin which does my work..
December 8th, 2009 at 8:06 PM
I have updated in my website, after doing some little fixes in css.
December 13th, 2009 at 4:07 PM
Thanks for this share. I make use of recent-posts-plugin.2.6.2.0 & post-plugin-library plugin for “recent post with thumbnail option”.
Now after reading your article, I have turned my related post into thumbnail option.
December 14th, 2009 at 11:45 PM
Great plugins, tried it on my site, works well. Still need to play around with my css.
To show only thumbnail remove php the_title() in the template.
For poster whose used other plugins to get the thumbnail, have a look at your postmeta table and see the value and just change the template “thumbnail_url” to that.
Theres also get post image plugins which you can use if you dont have custom field, but it requires a bit of work.
Make sure you have a look at your html source code to see is the thumbnail is properly pathed.
Tips to anyone whose play around with css, use css refresh for firefox plugin so you get intant refresh everytime you modify your css. Its beta but it works.
December 17th, 2009 at 1:52 PM
Thanks for the tutorial!
Some tinkering might be in order…
I’ll echo @Rajesh with a recommendation for “wp-thumbie”, which automatically generates thumbnails.
Your CSS looks better though
December 23rd, 2009 at 9:40 PM
Hi,
Is there a way to use get_bloginfo() and template_directory in yarpp-thumbnails-template.php to link to default-image.jpg ?
Thanks
December 28th, 2009 at 7:49 PM
Thanx alot for a great tutorial!!!
I managed to get auto thumbnail resize work on my site. It’s because i already used a Coldstone theme which have thumbnail custom field and auto resize function included. So i just replaced
“$related_thumbnail = get_post_meta($post->ID, “thumbnail_url”, $single = true);”
with
“$related_thumbnail = get_post_meta($post->ID, “Thumbnail”, $single = true);”
and added resize function:
<img src="/timthumb.php?src=&h=100&w=100&zc=1&q=100″ alt=”" />
Full code of the template:
“have_posts()):?>
have_posts()) : $related_query->the_post(); ?>
ID, “Thumbnail”, $single = true);
$default_thumbnail = ‘default-image.jpg’;
?>
<a href="” rel=”bookmark”>
<img src="/timthumb.php?src=&h=100&w=100&zc=1&q=100″ alt=”" />
<img src="” alt=”" />
No related posts found
”
You can see examples on my site
http://www.djkrypton.de i think almost in every post)
Thanx once again!
December 28th, 2009 at 7:53 PM
Sorry, but i think the whole php code is not shows
I’ll try it once again
have_posts()):?>
have_posts()) : $related_query->the_post(); ?>
ID, “Thumbnail”, $single = true);
$default_thumbnail = ‘default-image.jpg’;
?>
<a href="” rel=”bookmark”>
<img src="/timthumb.php?src=&h=100&w=100&zc=1&q=100″ alt=”" />
<img src="” alt=”" />
No related posts found
December 29th, 2009 at 3:00 PM
another really simple way to resize your thumbs is to change this:
<img
src="”
alt=”" />
to something like this:
<img
src="”
height=”100″ width=”120″ alt=”" />
at least, it’s working so far…
January 4th, 2010 at 2:52 AM
Helpful post. Thanks a lot for this good direction.
January 6th, 2010 at 11:15 AM
finally my YARP working with thumbnail.. thanks guys. i have made changes in yarp template to work with timthumb..
January 7th, 2010 at 5:31 AM
how to create it without customfield? so it automatically grab first attached image in post. because it is hardwork to edit 500 post in my blog.
January 16th, 2010 at 8:54 AM
Thank you for this easy tutorial.
January 22nd, 2010 at 7:32 AM
build in one step (plugin) please
January 22nd, 2010 at 7:36 AM
Hi.. better if, all step create in one plugin?
im confuse implementate in my blog
Your comment is awaiting moderation.
January 27th, 2010 at 7:42 AM
This is great! I have never thought of using something like this before in my blogs, but now that I can see how easy it is to implement I might have to add it
January 27th, 2010 at 1:45 PM
hi..its a really great tutorial. i have follow all the step. but there appear this messages “Parse error: syntax error, unexpected ‘}’ in /home/lapadeh/public_html/wp-content/themes/irresistible/single.php on line 21″when i click on my post!
what happen????
January 27th, 2010 at 9:32 PM
I’ve modified this template to do show the first image that is found in a post. It actually combines that with the custom-field. So we have (in order):
1) Use the custom field “template_url” image
2) If not found, then use the first-image found in post
3) If not found, then use a default image
Hope this helps someone! Sorry, i’m no good with php, but its pretty simple and can probably be tidied a bit.
http://www.actionscriptstuff.co.uk/ianwebb/yarpp-template-thumbian2.zip
February 20th, 2010 at 3:23 AM
I think we can use Wordpress 2.9’s new feature “Post-Thumbnail” for this plug-in.
Is anyone using it?
March 1st, 2010 at 3:41 PM
Thanks for the code. I was looking for a way to customize my related post.
March 1st, 2010 at 6:19 PM
I use this, and its perfect.
But i wonder – how can I use this in the sidebar/ widget with Recent posts or most popular?
Any tips?
Join the Conversation!
Remember: Life's not all doom and gloom, so please keep it constructive. If we've made an error or missed something big, please let us know! Learning is revisions, after all.