Cara Membuat Related Post dengan Thumbnail

  • dunia hitam
  • kata
    • kata lucu
    • kata bijak
    • kata mutiara
    • kata cinta
    • kata gokil
  • lucu
    • gambar lucu
    • pantun lucu
    • tebakan lucu
    • kata lucu
    • cerita lucu
  • berita
    • berita unik
    • berita politik
    • berita artis
    • berita aneh
  • kesehatan
    • asam urat
    • kanker
    • jantung
    • hepatitis
    • ginjal
    • asma
    • lambung
  • gambar
    • gambar unik
    • gambar lucu
    • gambar aneh
    • gambar animasi
    • video lucu
  • hoby
    • burung
    • ikan
    • piaraan
  • contoh
    • surat lamaran
    • recount text
    • descriptive text
    • curriculum vitae
    • deskripsi
  • video
    • video lucu
    • video hantu
    • video polisi
    • video totorial
    • video panas
    • video lagu
  • blog
    • SEO
    • template
    • script
    • widget
    • backlink
    • imacros
  • komputer
    • excel
    • macro excel
Home » Internet » Tips dan Trik » Cara Membuat Related Post dengan Thumbnail

Cara Membuat Related Post dengan Thumbnail

Sebelumnya saya pernah membuat tulisan tentang Cara Membuat Related Post di Blog. Intinya sama saja dengan tulisan kali ini Cara Membuat Related Post dengan Tumbnail cuma tampilannya yang berbeda yaitu sekarang dengan tumbnail kalau yang pertama
hanya berupa daftar. Kelebihan dengan menggunakan tumbnail ini tentunya akan kelihatan lebih menarik dan lebih indah, tapi kembali pada diri masing-masing lebih suka yang mana.

Langsung saja ikuti cara-caranya:
 
1. Masuk ke Rancangan ---> Klik Edit HTML
2. Centang Expand Template Widget
3. Paste kode dibawah ini diatas kode </head>

<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.2em;
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://sites.google.com/site/bangiz/js-berbagiilmuinspirasidancerita/relatedpostwiththumbnails.js.js' type='text/javascript'/>
</b:if>

4. Cari salah satu kode di bawah ini (gunakan Ctrl+F)


    <div class='post-footer-line post-footer-line-3'>
    atau 

    <p class='post-footer-line post-footer-line-3'>
 
5. Lalu letakan kode dibawah ini, dibawah salah satu kode di atas

<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://bangiz.blogspot.com' 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=&quot;Related Posts&quot;;
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div style='clear:both'/>
</b:if>
6. Simpan Template dan lihat hasilnya.

Ditulis oleh Unknown, Jumat, 21 Desember 2012 09.03- Rating: 4.5

Judul : Cara Membuat Related Post dengan Thumbnail

Deskripsi : Sebelumnya saya pernah membuat tulisan tentang Cara Membuat Related Post di Blog . Intinya sama saja dengan tulisan kali ini Cara Membu...
keyword :Cara Membuat Related Post dengan Thumbnail, Internet, Tips dan Trik
Posting Lebih Baru
Posting Lama
Beranda
Postingan Populer
  • Foto: Uniknya Kendaraan Anti Banjir di Thailand
    Banjir yang melanda kota besar terkadang menyulitkan kita untuk melakukan transportasi darat perlu kendaraan khusu untuk menembus genangan b...
  • Gaya Absensi Ibas Saat Paripurna DPR
    Putra bungsu Presiden Susilo Bambang Yudhoyono, Edhie Baskoro Yudhoyono, punya gaya sendiri soal absensi rapat di DPR. Dalam sidang Paripurn...
  • Wallpaper Lucu HD Terbaru
    Setelah sebelumnya saya berbagi tips dan trik blogging yaitu Cara Membuat Label Keren Dengan Efek Bergerak dan Wallpaper Kartun Cinta Rom...
  • Cara mendaftarkan blog ke w3 directory
      Kali ini saya akan share  Cara mendaftarkan blog ke w3 directory  untuk mendapatkan backlink berkualitas secara  gratis, dengan...
  • Wallpaper Gambar Kucing Dengan Kata Kata
    Setelah sebelumnya Bangiz berbagi tentang foto sampul Barcelona dan juga wallpaper Autumn . Pada kesempatan kali ini Bangiz akan berbag...
  • 5 Aksi Jokowi Mata-matai Anggaran
    Jangan coba-coba bermain menyelewengkan anggaran DKI Jakarta. Gubernur DKI Jakarta Joko Widodo (Jokowi) punya beragam cara mengontrol APBN 2...
  • Foto Pertama iPhone 5S Bocor di Internet
    Di tahun 2013 ini Apple diyakini akan kembali meluncurkan iPhone model terbaru. Kabarnya, perusahaan yang didirikan Steve Jobs ini akan meri...
  • Hotel Bawah Tanah Terdalam di Dunia
    Hotel Bawah Tanah Terdalam Di Dunia Ingin merasakan tinggal di hotel yang lain dari biasanya? Jika ya, mungkin inilah saatnya anda mengunjun...
  • Kata Mutiara, Kata Bijak, Kata Cinta, Kata Motivasi, Kata Lucu dan Kata Galau dengan Gambar
    Pada kesempatan kali ini saya berbagi tentang kata-kata mutiara. Maklumlah hampir semua orang khususnya mulai dari orang yang beran...
  • Aneh, Orang Ini Merasa Nyaman Tinggal di Kuburan
    Seorang warga miskin pindah dan menempati sebuah kuburan berumur 100 tahun setelah kehilangan rumahnya. Pria tersebut bernama Bratislav Stoj...

Info dunia hitam © Cara Membuat Related Post dengan Thumbnail