How to Blog | How to Add Related Posts Widget to Your Blog.

Related Posts Widget

By this post on how to blog you can learn how to add related posts widget on your blog
1. Sign in to your 'Dashboard'.
2. Go to 'Design'.
3. Go to 'Edit HTML'
4. Check the 'Expand Widget Templates'.
5. Search for the </head> tag.
6. Add the code just before the tag.

<style> #related-posts { float : left; width : 540px; margin-top:20px; margin-left : 5px; margin-bottom:20px; font : 11px Verdana; margin-bottom:10px; } #related-posts .widget { list-style-type : none; margin : 5px 0 5px 0; padding : 0; } #related-posts .widget h2, #related-posts h2 { font-size : 20px; font-weight : normal; margin : 5px 7px 0; padding : 0 0 5px; } #related-posts a { text-decoration : none; } #related-posts a:hover { text-decoration : none; } #related-posts ul { border : medium none; margin : 10px; padding : 0; } #related-posts ul li { display : block; background : url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiP3PBhTPjO3riRGLIkAiJAWbv3bYR-bpCBpLEGK0pfNGv1oguZTQ2KeI-N0X8spKAX-5l98PD362incFfywaAMirrYF99Hw9ky665x4R4xVoY8oN-iLuxFdCD58cQ9WbfDHSoypNonueA/") no-repeat 0 0; margin : 0; padding-top : 0; padding-right : 0; padding-bottom : 1px; padding-left : 21px; margin-bottom : 5px; line-height : 2em; border-bottom:1px dotted #cccccc; } </style> <script src='http://theblogtemplates.com/scripts/Related_posts_hack.js' type='text/javascript'/>

7. Now search for <data:post.body/>. In some of the templates this code may this
<div class='post-body>
or
<data:post.body/>

8. Add the following code just under the code you just searched for. 

<b:if cond='data:blog.pageType == "item"'>
<div id="related-posts">
<font face='Arial' size='3'><b>Related Posts : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><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=5&quot;' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div></b:if>

9. Now Save your Template and you're done.