உங்கள் பிளாக்கரில் Related posts புதிய பதிவுகள் imageயுடன் தோன்ற வேண்டுமா?

 
Add related posts widget with Thumbnail
 
Advantage of having related posts widget is that, Suppose any user is reading one of your blog post and seeking for some information. After finishing of reading he might be impressed with your post and want to visit another, then this widget is easiest way for surfing through related posts. Thus Number of page visits will be increased and as well your traffic bounce ratio will be decreased gradually.

#Step 1. Log in to your Blogger Dashboard and Navigate to Layout > Edit HTML and checked the Expand Widget Templates

#Step 2. Find(Ctrl+F)  
</head> இந்த code மேலே Paste பண்ணுங்க:


<!--Related Posts with thumbnails Scripts and Styles Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type="text/css">
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}
#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}
#related-posts a:hover {
background-color:#d4eaf2;
}
</style>
<script src='http://sites.google.com/site/besthowtoblogger/blogspot/relatedPostWiththumbs.js' type='text/javascript'/>
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->


#Step 3. Find the either line given below.

<div class='post-footer-line post-footer-line-1'>
அல்லது
<p class='post-footer-line post-footer-line-1'>


 இந்த கீழ் Paste பண்ணுங்க.
<!-- Related Posts with Thumbnails Code Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=5;
var relatedpoststitle="Related Posts";
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div style='clear:both'/>
</b:if>
<!-- Related Posts with Thumbnails Code End-->



#Step 4. எத்தனை பதிவு காணப்பட வேண்டும் மாற்றலாம்:

var maxresults=5;




To edit the title of the widget you can change this line of code:

var relatedpoststitle="Related Posts";

#Step 5. Save template and done!.