This function will help you capture your reader and make your blog more attractive because when the readers read until the end of articles they’ll see related post. It encourages them to read other articles that you got.

Follow steps as below;

1. Go to Layout --->Edit HTML in your Blogger Dashboard.

2. Back up your existing Template before making any changes!

3. Make sure to check the "Expand Widget Templates" box.

4. Search for the </head> tag.

5. Add the following code just before the </head> tag

<!--Related Posts Scripts and Styles Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>
#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, &#8220;Times New Roman&#8221;, 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:0 0 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/AVvXsEjAvuiT4XHjixgOnLLeN0fuqPfjliiffY8G1Rcpl435nMp8362vUlSmKqSVQoXkLVu2pVIqAQwBmZiofIHvpKyTEpcGY4GfncFBNdh8XVkhoCgBAf-4Ae1z7UbXTv8vk3DLzi4S0GbR4-4/s200/greentickbullet.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="Related Posts";
</script>
<script src='http://blogergadgets.googlecode.com/files/related.js' type='text/javascript'/>
</b:if>
<!--Related Posts Scripts and Styles End-->
</head>
6. Now search for <div class='post-footer-line post-footer-line-1'>. In some of the templates this code may look like this

<p class='post-footer-line post-footer-line-1'>

7. Add the following code just above the code you just searched for.

<!-- Related Posts 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&amp;max-results=6&quot;' type='text/javascript'/></b:if></b:loop><a href='http://www.bloggerplugins.org/2009/08/related-posts-for-blogger-widget.html' style='display:none'>Related Posts Widget</a>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=5;
removeRelatedDuplicates(); printRelatedLabels();
</script>
</div>
</b:if>
<!-- Related Posts Code End-->

8. Now just save your template.That’s it!!!

Any questions, please do not hesitate to leave a comment as below.
If you like this post, you can subscribe to keep up to date daily via e-mail Subscribe Now