0 Simple Cute Related Post Widget Without Thumbnail

Related Post Widget is useful to get more page visit. So today you won't find any templates without related post widget. Though blogger didn't introduce related posts widget so blogger always have to rely on outsider sources. List style related post is old concept but it is useful to make your site load faster. So I have coded this related post with little unique design. You will get every Related post with RSS feed icon and the icon will change color on mouse over. Hope it will help you to tailor your blog.  So just follow the simple steps to install related post widget into your blog.

Step 1 Log in to your blogger account and Click on Template  ->

Step 2 Now click on Edit HTML-> Unfold code

Step 3 Now find ]]></b:skin> by Pressing  Ctrl + F

Step 4 And Paste the below code above ]]></b:skin> and save your template

/* Related Post By www.bloggerspice.com */
#related-articles{float:left;width:350px;}
#related-articles .widget{margin:0;padding:0}
#related-articles .widget h2,#related-posts h2{font:bold 13px Arial;color:#000;text-transform:none;margin:0 0 5px;padding:0}
#related-articles a{color:#4a4e2d;font:12px Arial}
#related-articles a:hover{color:#ea5402}
#related-articles ul{margin:0;padding:0;list-style:none;}
#related-articles ul li{background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHPj-usaLtgKfuKVXukhh-ae-ygMS2i2ni4DDiwww2mp2c2-eazg8vu9IiZJye3pfIwqt8Cs3WLw0uUE1Hcv5X2vEm_46rtj0EKleGU6LZjXRZmw-XsrYG97PUS0I_Vxkm_w1Q9nT5UCd7/s1600/01.png) no-repeat 0 8px;text-indent:0;line-height:1.2em;margin:0;padding:2px 0 2px 10px; border-bottom:2px dotted #cccccc;}
#related-articles ul li:hover{ 
background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhql_5-xAlPCYaNLbqB34UoExZIyzHjSQy384GRqoV4BWIEOuZKjtb8jVCb-2wDM5YKiLVIzvDw2Yb1vPLg1kqoreSvO6eK5vwr0CTusobYi0Glg2rWl86kozQW7SF8WbnMa8HKn9Fg6uEf/s1600/25.png) no-repeat scroll 0px 6px !important;
}

Step 5 And Paste the below code after/below ]]></b:skin> and save your template

<script type='text/javascript'>
var relatedpoststitle=&quot;Related Articles&quot;;
</script>
<script src='http://bloggerspicebd.googlecode.com/files/related-BS.js' type='text/javascript'/>

Step 6 Now again find out <data:post.body/>(Paste the below Code here)<b:else/> .

<div id='related-articles'>
<b:loop values='data:post.labels' var='label'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=8&quot;' type='text/javascript'/></b:loop>
<script type='text/javascript'>
var maxresults=6;removeRelatedDuplicates(); printRelatedLabels(&quot;<data:post.url/>&quot;);
</script>
</div>

Customization

• Change width:350px to increase or decrease width of the widget.
• Change maxresults=6; to set the number of post you want to display.