Related Post for Blogger

Before using this technique,i have using LinkWithin gadget to show related stories under each post.However,its time consuming to load.

Searching at internet and found this very easy step to follow.

How to add Related Post for Blogger

Follow step below :

1. Login to your blogger

2. Then Go to Layout > Edit HTML

3. Then click to Download Full Template .

4. Check Expand Widgets Templates.

5.Press CTRL+F and find ]]></b:skin>

6. Paste the code below after ]]></b:skin>

<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}
#related-posts .widget{
padding-left:6px;
margin-bottom:10px;
}
#related-posts .widget h2, #related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, “Times New Roman”, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:blue;
}
#related-posts a:hover{
color:blue;
}
#related-posts ul{
list-style-type:none;
margin:0px 0;
padding:0px;
text-decoration:bold;
font-size:15px;
text-color:#000000
}
#related-posts ul li{
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvB6Q1KtW9frYYQpXt-YteMba626REnOveqrsOMhYuqoGWok4DhsQ_xoX7v_GueCogAapiaFsyOnDiOda4bVnOHNMewxeI2d2jBlFeg8s6akLFnjltsN2Gz9FVn0AEN6DdAO3901Mulf0/s1600/rssrelate+post.png) no-repeat ;
display:block;
list-style-type:none;
margin-bottom: 13px;
padding-left: 30px;
padding-top:0px;}
</style>
<script type='text/javascript'>
var relatedpoststitle="You may also like these stories";
</script>
<script src='http://blogger-tabbed-widget.googlecode.com/files/related%20post%20by%20kewin.js' type='text/javascript'/>
</b:if>

7. Then find this code <data:post.body/> and paste code below after it.

<b:if cond='data:blog.pageType == "item"'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != "true"'>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=6"' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'>
var maxresults=5;
removeRelatedDuplicates(); printRelatedLabels("<data:post.url/>");
</script>
</div>
</b:if>

8.Then save the template.Done

Tips : You can change the icon used in this tutorial with your own .
Change the title with your own if you want .
Change the number of related post show.