web
analytics
≡ Menu

Related Posts With Thumbnails After Posts In Thesis Theme

Every blogger want to reduce bounce rate so to attract more advertisers. The possible tip to reduce bounce rate and make your readers aware of your previous article is to display related posts. Yet Another Related Plugin allows you to display related posts but not with thumbnails. Here i am going to show you that how you can display related posts with thumbnails in your thesis theme.

related posts with thumbnails

Note:- This is only for Thesis Users.

How to Display Related Posts With Thumbnails in Thesis?

1. Download Post Plugin Library and Similar Post Plugin

2. Install and activate both plugins.

3. Go to Settings>Similar Posts

Here you will have to click on “Output” button located at the top of the page. [As shown in screen shot]

similar post pluginAfter clicking on “Output” you will have to paste the below code in “Output Template” box.

<div id="similar-posts"><li><a href="{url}"><img src="{custom:thesis_post_image}" width="100" height="100" alt="" /></a><h1>{link}</h1></li></div>

output setting4. Save OutPut Setting.

6. Open your custom.css file and paste the below code

#similar-posts li {
        margin-left: 6px;
        float: left;
        font-weight: bold;
       background: #f9fdfd;
       font-family: Times, "Times New Roman", serif;
    line-height: 1.4em;
        overflow: hidden;
}
#similar-posts img { float: left; border: 2px solid #222; margin-top:4px; }
#similar-posts h1 {
clear:left;
font-size:13px;
font-weight:bold;
height:auto;
line-height:17px;
margin:0;
overflow:hidden;
text-transform:capitalize;
width:126px
}

7. The final step is to open “Thesis Open Hook” [If you have not installed Open Hook Plugin, then Download from here and install it. After activating the plugin, you will see Thesis Openhook option in Appearance panel.] Open it and place the below code in After Post Box.

<?;php similar_posts(); ?>

That’s All….
Visit your blog and you will see related posts with thumbnails added just after post.

{ 1 comment… add one }
  • Thiru@webappdirectory

    October 22, 2010, 6:54 am

    Awesome share. Thanks Bilal.

    Reply

Leave a Comment