How to make related post

For my friend who had tried or related post thumbnail image would be more interested to use it, because it looks quite interesting with the images (thumbnails) as Backround. Disadvantages of this picture is a related post related post this too takes place on your blog page. So we can not display the number of articles to the fullest. Well there is one way to maximize the related post or a marquee alternative is to run
The advantage of this trick is pal can show the number of your blog article without consuming a lot of places on the blog page is the marquee or walk.

But according to the author, the article linked is quite fashionable and need to be applied on the Blog. For installation, please follow the steps below:
1. Log diakun Blogger pal,
2. On the Dashboard page, go to the Template and select Edit HTML,
3. In the template editor box, any click in one 'box' is, and
     press Ctrl + F, please find the code </ head>,
4. Put CSS and JavaScript following before </ head>,

<!--Related Posts with thumbnails Scripts and Styles Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}
#related-posts h2{
font-size: 1.3em;
font-weight: bold;
color: #000000;
font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:#000000;
}
#related-posts a:hover{
color:#000000;
}
#related-posts a:hover {
background-color:#d4eaf2;
}
</style>
<script src='http://eflianda-blogzzz.googlecode.com/files/relatedthumbs.js' type='text/javascript'/>
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->

 5. Once the script above, search <div class='post-footer'> or
    <div class='post-footer-line post-footer-line-1'/>, place the following script in the above code

<!-- Related Posts with Thumbnails 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_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=5;
var relatedpoststitle=&quot;Artikel Terkait&quot;;
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div style='clear:both'/>
</b:if>
<!-- Related Posts with Thumbnails Code End-->

Note :
 Blue figure is the number of posts display related post, adjust the width of blog buddy.

6. Finally, click Save Template.