Headlines News :
Home » » Cara Membuat Related Post Thumbnail (Artikel Terkait Bergambar) di Blog

Cara Membuat Related Post Thumbnail (Artikel Terkait Bergambar) di Blog

Written By fathans on Selasa, 14 Februari 2012 | 23.48

      Cara Membuat Related Post  Thumbnail  (Artikel Terkait  Bergambar) di Blog pada bagian bawah postingan akan terlihat Related Post (Artikel Terkait) berupa Gambar dan Judul (Jika pada postingan tidak ada gambar, maka tambilan gambar akan bertuliskan no image),  jika sobat berminat untuk Membuat Related Post Thumnail (Artikel Terkait Bergambar) di Blog , silahkan ikuti langkah-langkahnya dibawah ini.

















1. Login ke Blogger

2. Design (Rancangan) => Edit HTML =>  Centang Expand Widget Template

3. Cari Kode  </head>  (cari dengan Ctrl+F) 

4. Letakkan Kode di bawah ini tepat di atas kode </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: #585858;

font-family: Georgia, &#8220;Times New Roman&#8221;, 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://sastrablog.googlecode.com/files/relatedthumbs21.js' type='text/javascript'/>

</b:if>

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






5. Kemudian Cari Kode  <div class='post-footer'>

6. Masukkan Kode  bawah ini tepat diatas kode  <div class='post-footer'>



<!-- 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>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;

var maxresults=8;

var relatedpoststitle="Related Posts";
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div style='clear:both'/>
</b:if>
<!-- Related Posts with Thumbnails Code End--> 




7. Save Template


Catatan : Kode  var maxresults=8 diatas, angka 8 bisa sobat ganti sesuai dengan yang sobat mau.
Share this post :

+ komentar + 1 komentar

13 April 2015 pukul 21.20

terimakasih, ilmu yang sangat bermanfaat sekali :)
http://goo.gl/xp4nWV

Posting Komentar

 
Support : Creating Website | Johny Template | Mas Template
Copyright © 2011. NYOBANGEBLOGS - All Rights Reserved
Template Created by Creating Website Published by Mas Template
Proudly powered by Blogger