The relevance of the posts is based on the tags or labels, assigned to each of the posts on your blog.
The Widget can be embedded in 9 steps:
1. Go to Layout >Edit HTML in your Blogger Dashboard.
2. Back up your existing Template before making any changes! Export your template to the safe, easy identifiable location.
3. Check the "Expand Widget Templates" box.
4. Search for the tag.
5. Add the following code just before the tag.
#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 {
color : #940f04;
font-size : 20px;
font-weight : normal;
margin : 5px 7px 0;
padding : 0 0 5px;
}
#related-posts a {
color : #054474;
font-size : 11px;
text-decoration : none;
}
#related-posts a:hover {
color : #054474;
text-decoration : none;
}
#related-posts ul {
border : medium none;
margin : 10px;
padding : 0;
}
#related-posts ul li {
display : block;
background : url("https://lh3.googleusercontent.com/blogger_img_proxy/AEn0k_twAEjCBRzp8hmC2Waa1e8A9xK1J65ujPzp6nVb4gdiwzSsYd5n2M_KP998Tj6YJRkLrVItM5i0xbEZTLHVnS0mq1merMv6QZLIIyFigwOxIYXnGdiDgy2yY875UyI8-FQS0PCTodk=s0-d") no-repeat 0 0;
margin : 0;
padding-top : 0;
padding-right : 0;
padding-bottom : 1px;
padding-left : 16px;
margin-bottom : 5px;
line-height : 2em;
border-bottom:1px dotted #cccccc;
}
6. Now search for
7. Add the following code just beneath the code you just searched for.
8. The default number of the posts is 5 in the code, but at this step you can modify it as per your needs, changing the number in the following line: max-results=5
9. Now Save your Template and you're done!
The credit for the gadget development goes to the Widgets4Free blog.