Cara membuat Artikel Terkait Dengan Gambar/Thumbnails

Baiklah tanpa panjang lebar langsung saja kita mulai tutorial ini.

1. Masuk ke akun blogger sobat
2. Klik design kemudian edit HTML
3. Jangan lupa Centang kotak kecil di kanan atas Expand Widget Templates
4. Biasakan untuk  download full template dulu,
5. Setelah itu letakkan kode berikut di atas </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.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:black;

}

#related-posts a:hover{

color:black;

}



#related-posts a:hover {

background-color:#d4eaf2;

}

</style>

<script src='http://belajarblogging.googlecode.com/files/releatedimage.js' type='text/javascript'/>

</b:if>

<!--Related Posts with thumbnails Scripts and Styles End-->

Kalau sudah,kemudian cari kode yang seperti <div class='post-footer-line post-footer-line-1'>

Dan letakkan kode di bawah ini di BAWAH kode di atas

<!-- 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><a href='http://bloggerbiasa.blogspot.com/2011/01/cara-membuat-artikel-terkait-dengan.html' style='display:none;'>Related Posts with thumbnails for blogger</a><a href='http://www.bloggerplugins.org/' style='display:none;'>blogger widgets</a>

<script type='text/javascript'>

var currentposturl=&quot;<data:post.url/>&quot;;

var maxresults=5;

var relatedpoststitle="Artikel Terkait";

removeRelatedDuplicates_thumbs();

printRelatedLabels_thumbs();

</script>

</div><div style='clear:both'/>

</b:if>

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

6 .Kemudian Simpan dan lihat hasilnya.

Selamat mencoba semoga berhasil, Salam Blogger :ZONA INFO

Artikel ini saya dapat dari : http://bloggerbiasa.blogspot.com