How to Make Related Post-How to Make Related Articles

How to Make Related Post-How to Make Related Articles - Related Post / Related article I think is a widget that should be there. because, in addition would make the layout more interesting, this widget will help readers find articles that actually sought, or other interesting articles in the same category, which is interesting to read.

Here's how to make it:
• Login to Dashboard -> Layout -> Edit HTML
• Check the "Expand Widget Templates"
• Find the code: </ head>
• Copy and Paste the following code BEFORE the </ head>.

----------------------------------------------------------------------------------------------------

<!--Related Posts with thumbnails Scripts and Styles Start-->
<!-- remove --><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.6em;
font-weight: bold;
color: black;
font-family: Verdana, Georgia, &#8220;Times New Roman&#8221;, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}

#related-posts  a:hover {
background-color:#d4eaf2;
}
</style>
<script type='text/javascript'>
var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXXjDkECY1IRvlfQWdScFU2lLRhfGbVLEdHER_yVH-HLbGgxF9Ib9du5sgYtRzSvy33MZ8FKnGHRYVytIrBe-wPISlvOMJJzmI3Of6DX66kCdBYpZpEnqPJI0MQylJUpYw9Fbbi-sJAbY/s400/noimage.png";
var maxresults=5;
var splittercolor="#d4eaf2";
var relatedpoststitle="Related Posts";
</script>
<script src='http://bloggergadgets.googlecode.com/files/related_posts_with_thumbnails_min.js' type='text/javascript'/>
<!-- remove --></b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->

---------------------------------------------------------

 • Then, find the code:

<div class='post-footer-line post-footer-line-1'>

 • Add the following code right AFTER the above code (the one that you find in your template)


---------------------------------------------------------------------------------------------------------------------

 <!-- Related Posts with Thumbnails Code Start-->

<!-- remove --><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>
<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:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
</script>
</div><div style='clear:both'/>
<!-- remove --></b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://www.bloggerplugins.org/2009/08/related-posts-thumbnails-blogger-widget.html'><img style="border: 0" alt="Related Posts Widget For Blogger with Thumbnails" src="http://image.bloggerplugins.org/blogger-widgets.png" /></a><a href='http://bloggertemplates.bloggerplugins.org/'><img style="border: 0" alt="Blogger Templates" src="http://image.bloggerplugins.org/blogger-templates.png"/></a>
</b:if></b:if>
<!-- Related Posts with Thumbnails Code End-->

---------------------------------------------------------

Notes:
• to regulate the amount of related articles, find this code: var maxresults = 5; Change the value of 5 to 7 for example, or how much you like.
• To change the title of his search for this code: var relatedpoststitle = "Related Posts";