How to Display Thumbnails For Related Posts in WordPress

Nur . Posted in How-To, Plugins 823 Views

By using this piece of code in your WordPress Theme’s single.php file you can increase page-views by adding thumbnails of related posts. There are plugins that can display thumbnails at the end of single post specially the popular YARPP (Yet Another Related Posts Plugin) plugin, but also you can use tags and a WordPress custom fields to show related posts.

This code is for  those who like to know how  How to Display Thumbnails For Related Posts in WordPress and how it works, here is the code to get related posts and their thumbnails.

Related Posts by Category

<?php $orig_post = $post;
global $post;
$categories = get_the_category($post->ID);
if ($categories) {
$category_ids = array();
foreach($categories as $individual_category) $category_ids[] = $individual_category->term_id;

$args=array(
‘category__in’ => $category_ids,
‘post__not_in’ => array($post->ID),
‘posts_per_page’=> 6, // Number of related posts that will be shown.
‘caller_get_posts’=>1
);

$my_query = new wp_query( $args );
if( $my_query->have_posts() ) {
echo ‘<div id=”related_posts”><h3>Related Posts</h3><ul>';
while( $my_query->have_posts() ) {
$my_query->the_post();?>

<li><div><a href=”<? the_permalink()?>” rel=”bookmark” title=”<?php the_title(); ?>”><?php the_post_thumbnail(); ?></a></div>
<div>
<h3><a href=”<? the_permalink()?>” rel=”bookmark” title=”<?php the_title(); ?>”><?php the_title(); ?></a></h3>
<?php the_time(‘M j, Y’) ?>
</div>
</li>
<?
}
echo ‘</ul></div>';
}
}
$post = $orig_post;
wp_reset_query(); ?>

Related Posts by Tags

<?php $orig_post = $post;
global $post;
$tags = wp_get_post_tags($post->ID);
if ($tags) {
$tag_ids = array();
foreach($tags as $individual_tag) $tag_ids[] = $individual_tag->term_id;
$args=array(
‘tag__in’ => $tag_ids,
‘post__not_in’ => array($post->ID),
‘posts_per_page’=>5, // Number of related posts that will be shown.
‘caller_get_posts’=>1
);
$my_query = new wp_query( $args );
if( $my_query->have_posts() ) {

echo ‘<div id=”relatedposts”><h3>Related Posts</h3><ul>';

while( $my_query->have_posts() ) {
$my_query->the_post(); ?>

<li><div><a href=”<? the_permalink()?>” rel=”bookmark” title=”<?php the_title(); ?>”><?php the_post_thumbnail(); ?></a></div>
<div>
<h3><a href=”<? the_permalink()?>” rel=”bookmark” title=”<?php the_title(); ?>”><?php the_title(); ?></a></h3>
<?php the_time(‘M j, Y’) ?>
</div>
</li>
<? }
echo ‘</ul></div>';
}
}
$post = $orig_post;
wp_reset_query(); ?>

First of all I would like to say thanks to mindBlogwprecipes, wpbeginner and MichaelH for this awesome piece of code! TimbThumb.

used this type of code in a PHP image-resizing script. Once you pasted this code in your theme file, the query uses the first tag of the post to fetch related posts. In the above example code , Six related posts are displayed. You can change this number.

In case if you are not satisfied from the above solution than The tutorial “Display Thumbnails For Related Posts in WordPress” explains to add thumbnails to your related post links with Yet Another Related Posts Plugin.

Resources:

Seso WordPress Theme

Recent Posts with Thumbnails Widget for Blogger
Query Function and Template Tags for WordPress
Display Thumbnails For Related Posts in WordPress
WordPress Related Post Plugin with Photo Thumbnails

Nur

I am a Wordpress, Website Developer and Designer, creator @ WP Arena, Provide Free WordPress consultation and can help to install WordPress in a secure way to small businesses and bloggers.

Free & Professional WordPress Security Service Free & Professional WordPress Security Service

We Love WordPress. WordPress Arena is a place for WordPress Developers and Designers, providing Tips, tricks, tools and resources to build a website or blog on WordPress. We also present The WordPress Showcase for all kind of WordPress Powered Websites.


Copyright © 2014 WP Arena All Rights Reserved

Divi WordPress Theme