Cara Membuat Related Post Dengan Thumbnail



Kali ini saya akan membahas tentang Cara Membuat Related Post Dengan Thumbnail, widget related post dengan Thumbnail ini merupakan alternatif selain Linkwithin, jadi ada cara lain membuat Related Post Dengan Thumbnail selain menggunakan jasa Linkwithin. Seperti ini contohnya :


Bagi sobat yang ingin memasang nya di Blog sobat silahkan ikuti langkah-langkah di bawah ini.

1. Login ke Blog kamu.

2. Pilih Rancangan > EDIT HTML.

3. Jangan Lupa Centang Expand Widget Template.

4. Cari kode </head> setelah ketemu copy kode di bawah ini tepat di atas kode </head>

<!--Related Posts with thumbnails Scripts and Styles Start-->
<!-- remove --><b:if cond='data:blog.pageType == "item"'>
<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, Times New Roman , 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 type='text/javascript'>
var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgC2in4tobQYz3K4nxKbRFiiIh8hyGJYZTm5FYKXJRk7hUr3G2oA7KajXgaohIawB1RsY_1gwi8uz504qVdinBnUNphrMLz-x3wGkRjz523ijMd1gH60rSspTlVW6RMRrfxAFLNT0aVNu4/s400/noimage.png";

var maxresults=5;
var splittercolor="#d4eaf2";
var relatedpoststitle="Related Posts";
</script>
<script src='http://infonetmu.googlecode.com/files/related-posts-with-thumbnails-for-blogger-pro.js' type='text/javascript'/>
<!-- remove --></b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->

5. Selanjutnya Cari kode <data:post.body/> setelah ketemu copy kode di bawah ini tepat di bawah kode <data:post.body/>

<!-- 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'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
</script>
</div><div style='clear:both'/>
<!-- remove --></b:if>
<!-- Related Posts with Thumbnails Code End-->

6. Simpan dan lihat hasilnya.

Keterangan :
var maxresults = 5 adalah jumlah artikel yang ditampilkan.
var relatedpoststitle="Related Posts";  kamu bisa ganti kata Related Posts dengan Kata lainnya.

Sekian penjelasan dari saya semoga sobat bisa memahaminya, dan selamat mencoba.

1 komentar:

  1. According to Stanford Medical, It is in fact the one and ONLY reason women in this country get to live 10 years more and weigh on average 42 pounds less than us.

    (And actually, it has NOTHING to do with genetics or some hard exercise and really, EVERYTHING around "HOW" they are eating.)

    BTW, What I said is "HOW", and not "what"...

    CLICK this link to determine if this quick quiz can help you unlock your real weight loss possibilities

    BalasHapus

Copyright © 2012 Berita Terbaru.