Jumat, 02 Desember 2011

Pasang Related Post dengan Thumbnails


Cara memasang Related Post Blogspot dengan Thumbnails - Related post sebenarnya cukup penting untuk meningkatkan jumlah pageview di blog kita! Seseorang mencari sebuah artikel, namun ada artikel yang dianggap sama penting juga dengan artikel yang dia cari, atau bahkan artikel itu adalah kelanjutan dari artikel yang dia cari!

Cara memasang Related Post with Thumbnails cukup mudah!
Pertama , Clik Design - Edit HTML lalu centang Expand Widget

Kedua , Cari kode </head>

Ketiga , salin script dibawah ini dan tempel diatas kode </head>
<!--Related Posts with thumbnails Scripts and Styles Start-->
<b:if cond='data:blog.pageType == "item"'>
<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:#585858;
font-family: Georgia, “Times New Roman”, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:#FFFFCC;
}
#related-posts a:hover{
color:#000000;
}
#related-posts a:hover {
background-color:#d4eaf2;
}
</style>
<script src='http://blogergadgets.googlecode.com/files/relatedthumbs21.js' type='text/javascript'/>
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->

Keempat , cari kode
<p class='post-footer-line post-footer-line-1'>
Lalu masukan kode dibawah ini tepat dibawah <p class='post-footer-line post-footer-line-1'>
<!-- Related Posts with Thumbnails Code Start-->
<b:if cond='data:blog.pageType == "item"'
>div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != "true"'>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=6"' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'>
var currentposturl="<data:post.url/>";
var maxresults=5;
var relatedpoststitle="Related Posts";
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div style='clear:both'/>
</b:if>
<!-- Related Posts with Thumbnails Code End-->

Terakhir , Save template!
Contohnya adalah Related milik dian_sunday dibawah!
Bagi pengguna handphone (khususnya java) baca artikel Cara Mengedit Template Blogspot Lewat Handphone !
Posted by: dian_sunday
diansunday Updated at: 00.51