Related Post dgn Thumbnail

Saya rasa Anda sudah melihat widget ini sebelumnya. Ya, widget ini memiliki tampilan yang sama dengan widget Linkwithin. Namun, widget ini bukan dari LinkWithin. Widget ini berasal dari BloggerPlugin. Saya telah mencobanya dan menerapkan trik ini didalam blog saya ini. Dan saya berharap ini dapat membantu pengunjung untuk menjelajahi artikel saya ini. Anda ingin tampilan blog anda seperti ini.

Ikuti langkah-langkah berikut ini :

1. Login ke account Blogger anda.
2. Cari kode </head>.
3. masukan kode dibawah ini sebelum kode tersebut.
   
   
   <!--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://blogergadgets.googlecode.com/files/relatedthumbs21.js' type='text/javascript'/>
   </b:if>
   <!--Related Posts with thumbnails Scripts and Styles End-->
   </head>
4. Sekarang cari <div class='post-footer-line post-footer-line-1'>.
5. Masukan kode dibawah ini setelah kode tersebut.
   
   
   <!-- 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'>
   var currentposturl=&quot;<data:post.url/>&quot;;
   var maxresults=5;
   var relatedpoststitle="Related Posts";
   removeRelatedDuplicates_thumbs();
   printRelatedLabels_thumbs();
   </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' style='display:none;'>Related Posts with thumbnails for blogger</a><a href='http://www.bloggerplugins.org/' style='display:none;'>blogger tutorials</a>
   </b:if></b:if>
   <!-- Related Posts with Thumbnails Code End-->
   
   Anda dapat merubah angka yang tercetak merah sesuai kebutuhan
6. Simpan Template anda dan lihat hasilnya.

nah semoga bermanfaat ya..
selamat mencoba..