You Are Here: Home - Blogspot - Memasang Artikel Terkait Thumbnails Pada Postingan Blog


Sobat tentunya sudah melihat beberapa artikel saya yang sudah menggunakan Artikel Terkait Thumbnails ini. Tentunya menarik dan k'ren kan?
Oh y sebelumnya saya berterima kasih banyak kepada MAS PUTU yang sudah berbagi ilmunya dan telah mengijinkan saya untuk mengCopas artikelnya. Hhee...
Baiklah, untuk lebih jelasnya mari kita langsung ke TKP sob.

Langkah-langkah Membuat Artikel Terkait yang berisi Thumbnails
  • Login ke Blogger dengan ID sobat 
  • Pada halaman Dasbor, pilih Tata Letak.
  • Kemudian pilih Edit HTML
  • Backup / simpan template anda dulu.
  • Beri tanda centang pada Expand Template Widget
  • Cari kode </head>
  • Copas (copy-paste) kode script dibawah ini dan simpan / taruh persis di atasnya  
                                                                                                                     
<!--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-->
                                                                                                                     
  • Cari kode <div class='post-footer-line post-footer-line-1'> atau jika tidak ditemukan cari kode berikut ini <p class='post-footer-line post-footer-line-1'> 
  • Jika sudah ketemu, copas (copy-paste) kode script dibawah ini, kemudian taruh di bawah salah satu kode tersebut tadi. 
                                                                                                                     
<!-- 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://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>
<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'/>
</b:if>
<!-- Related Posts with Thumbnails Code End-->
                                                                                                                     

Keterangan :
  • var maxresults = 5; berarti artikel yang akan ditampilkan adalah : 5 =?
  • relatedpoststitle var = " Related Posts "; Bisa diganti dengan Artikel Terkait atau Nama Lainnya 
Jika sudah selesai simpan template sobat dan lihat hasilnya.
Maka hasilnya seperti ini :
Bagaimana ??
Gampangkan?

Jika sobat ingin lebih jelas, sobat bisa langsung lihat di artikel aslinya DISINI
                                                                                                                     

Special Thank's : MAS PUTU
                                                                                                                     

Tags: Blogspot

1 komentar

  1. sahrul says:

    tq sob...sangat membantu...kunjungan balik di tunggu...

Leave a Reply

Berikut adalah beberapa aturan untuk memberikan komentar di blog ini :

1. Semua komentar kecuali spam dipersilakan.
2. Anda dipersilahkan jika ingin membuat permintaan dan pertanyaan.
3. Jangan gunakan nama-nama seperti Admin, Penulis, Operator, atau yang lainnya untuk memberikan komentar karena akan membuat orang lain salah paham.

Terima kasih banyak telah berkomentar...