Related Post Widget For Blogger With Thumbnails

Related post widget merupakan widget untuk blogspot dimana ianya akan menampilkan artikel artikel berkaitan.Widget ini akan memaparkan pada halaman posting sahaja.

Selain menggunakan Linkwithin atau Nrelated, anda juga boleh memasang related post secara manual
disni adalah version terbaru dari Blogger Plugins.

Cara memasang related post widget:
1. Login ke blogger.com
2. Pergi ke halaman template -> Edit Html -> Tick expande template widget -> proceed
3. Cari perkataan </head> dan gantikan dengan code dibawah

<!--Related Posts 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 .widget{
padding-left:6px;
margin-bottom:10px;

}
#related-posts .widget h2, #related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:blue;
}
#related-posts a:hover{
color:blue;
}
#related-posts ul{
list-style-type:none;
margin:0 0 0px 0;
padding:0px;
text-decoration:bold;
font-size:15px;
text-color:#000000
}
#related-posts ul li{
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjP_JbyoPRJO_8LkbQZ_f5EvPAy9-mNEPAbHwrKgCLHqrBG3MzwppyN7T2zB33bqU2f4-mzwYCDq-POGPCs1SLY5hzMSQb5SxQMolRakcfD0r2XwWgEh_ixHpUK38DPRzWaGKSXXr4sso/s200/greentickbullet.png) no-repeat ;
display:block;
list-style-type:none;
margin-bottom: 13px;
padding-left: 30px;
padding-top:0px;}
</style>

<script type='text/javascript'>
var relatedpoststitle="Related Posts";
</script>
<script src='http://bloggergadgets.googlecode.com/files/related_posts_min.js' type='text/javascript'/>

<!--Remove--></b:if>
<!--Related Posts Scripts and Styles End-->
</head>

Kemudian cari perkataan

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

dan letakan code dibawah ini dibawah code <div class='post-footer-line post-footer-line-1'> itu tadi.

<!-- Related Posts 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>
<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=6&quot;' type='text/javascript'/></b:if></b:loop>

<script type='text/javascript'>
var maxresults=5;
removeRelatedDuplicates(); printRelatedLabels(&quot;<data:post.url/>&quot;);
</script>
</div>

<!--Remove--></b:if>
<!-- Related Posts Code End-->

Preview, Jika tiada error, save template anda.

Tips*
Tukar perkataan bewarna merah mengikut kesesuaian anda