MachoArts passionately provides useful articles for Creatives. We share resources for Designers, Photographers & bloggers.

How to get related post thumbnails in thesis without plugins

Posted in Blogging By Rohan

Tired of all the numerous plugins out there which apparent ‘help’ you to show related posts ? or are you more tired of the thousands of those posts which list these plugins ! I sure am! So here I am writing a post on how to make related posts on your thesis blog without any plugins.

Related posts

Advantages Of Related Posts Without Plugin?

We all know that plugins slow down your site and search engines now a days are stressing on site load speed to rank sites. You don’t want something visually appealing to kill your sites load time and SERPs do you? Related posts also serve a good SEO purpose since internal linking increases crawl rate and decreases indexing time delay. With an added advantage that people get more engrossed and get more content to read and this also reduces your bounce rate and places you in a better position to convert them into regular readers. See this script in action on techlunatic.

So Lets Get To The Code.

You simply need to use a thesis hook and paste the code whatever you want the related posts to appear. One is the code that makes the function work which we need to paste in custom_function.php and then paste the required styling in the custom.css file and you are done ! time to remove some plugins buddies! Here is the code

Now your function is ready , you need to style it using CSS , so paste this in your custom.css file , and amend it to your linking

// Add Featured Image Support
add_theme_support( 'post-thumbnails' );
add_image_size( 'related-posts', 100, 100, true );

// Related Posts By Tag
function related_posts() {
if ( is_single() ) {
$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,
'orderby'=>'rand' // Randomize the posts
);
$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>
<a href="<?php the_permalink()?>" rel="bookmark" title="<?php the_title(); ?>">
<?php the_post_thumbnail( 'related-posts' ); ?>
</a>
<div>
<a href="<? the_permalink()?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_title(); ?></a>
</div>
</li>
<? }
echo '</ul></div>';
} }
$post = $orig_post;
wp_reset_query(); ?>
<?php } else { } }

add_action('thesis_hook_after_post','related_posts');

Paste this in your Custom.css

.custom #related_posts ul {
    margin:0;
    overflow:hidden;
}
.custom #related_posts li {
    float: left;
    list-style: none;
    margin: 0 0 0 20px;
}
.custom #related_posts li:first-child {
    margin-left:0;
}
.custom #related_posts li a {
    display:block;
    font-size:12px;
    line-height:16px;
    text-align:left;
    text-decoration:none;
    width:100px;
}
.custom #related_posts li a:hover {
    text-decoration:underline;
}

I know this post was long due and you were eager to read it, and I had specially got a request from a friend of mine who works at LSF interactive who was having trouble with designing his personal blog. Hope this post clears the doubt and comments and reactions are always welcome.

9 comments
sai krishna
sai krishna

I heard about timthumb ? there is any problem with using it ?

Rajesh
Rajesh

is there any way to get the same functionality through timthumb..??

max
max

Doesn't work on thesis. I can't get the image to show up using your method, could you please explain how to get the image to show? I'm using thesis 1.8.2

suraj
suraj

Hey Max, are you getting any type of error?

Sanat
Sanat

Unfortunately, there is no thumbnails in my related posts. Can you explain a little more about it.

Kunal C
Kunal C

Hey Rohan,

Just came across this post while I was writing something similar for my website. Nice and simple, liked it. But i have written a complete code to take care of different ways image is attached to the post. Using advanced image scanning algorithm to find thumbnail image for the post. It also looks for Thesis post image we usually specify for each post. Also search for featured image if enabled for the theme.

Would love to have your views on the same..

Cheers,
Kunal

Kamal Patel
Kamal Patel

Rohan

Nice Post.....
But a little mistake you did: you need to write "custom_function.php" rather than "custom.css" in first code.....

I tried this code but didn't work for me.

Julio Ruiz
Julio Ruiz

Thanks Rohan.

This post was very useful for me, i saved me hours of trying and failing with my thesis theme.

Satish
Satish

Cool, i want to get this theme for my next blog, can we add a slide to this theme ? if so it can be a bigger one which usually comes with newscast theme ?