How to add related posts (without thumbnails) to your blog

A very good way of increasing your page views and in turn earn more money from clicks is to add related posts widget to your posts. 

The related post widget always fetch the related posts to the article been read by your website visitors. It is always located after the post to make it visible to the reader.

 This allows readers to stay longer on your blog.

 I am going to explain step by step to you, how to add related posts widget (without thumbnails) to your blog  . Now, let's get started.

1. Login in Your Blogger Account
2. Go to Dashboard > Template > Edit HTML > Proceed
3. Check "Expand Widget Templates" box
4. Now search for this code

    </head>

5.  Copy and paste the codes below right before the searched code

<style>
#related-postz { float: left; width: 100%; margin-top: 20px; margin-left: 5px; margin-bottom: 20px; line-height: 25px; font-weight: bold; font: 18px Arial,sans-serif; margin-bottom: 10px; }
#related-postz .widget { list-style-type : none; margin : 5px 0 5px 0; padding : 0; }
#related-postz .widget h2, #related-posts h2 {
font-size: 1.1em;
font-weight: bold;
color: black;
font-family: Georgia, “Times New Roman”, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em; }

#related-postz a { text-decoration : none; }
#related-postz a:hover { text-decoration : none; }
#related-postz ul { border : medium none; margin : 10px; padding : 0; }
#related-postz ul li {
display : block;
background : url("http://4.bp.blogspot.com/-UL84g6GAxqA/Ti2byL9zDlI/AAAAAAAADpE/Z5sMO_1KN6w/s1600/ico.gif") 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;
font-size: 1.1em;
font-weight: bold;
color: black;
font-family: Georgia, “Times New Roman”, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
} </style>
<script src='http://blogfilez.googlecode.com/files/related.js' type='text/javascript'/>

6. Save your template.

7. Search for this code

<data:post.body/>

8. Copy and paste the codes below just below the searched code

 <b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-postz'>
<font face='Arial' size='4'><b>Related Posts:</b></font>
<b:loop values='data:post.labels' var='label'><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>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
<div align='right' style='font-size:11px'><a href='http://www.bizschoolonline.info/'>Blogging Tips</a></div></div>
</b:if>

 9.    Save Your Template
  That'all. View your blog and you will see that the related post widget has been added. Please share
            this post if you love it.

           Remember, I'll love to see your comments on my blog.