Cara Memasang Widget Artikel Terkait Dengan Gambar di Blogspot

Assalamu’alaikum.Wr.Wb | Ada seorang pengunjung BoyTrik, bertanya ke saya tentang, bagaimana cara memasang widget artikel terkait, seperti punya blog saya. Namun dengan di sertai gambar seperti punya AriOutsider69.

Tak ingin membuat menunggu saya langsung mencari caranya di Google, jujur saja Widget artikel terkait dengan Gambar milik blog ini sudah bawaanya, jadi jelas saya tidak tahu cara memasangnya. Dan setelah sekian lama, akhirnya sayapun berhasil menemukannya, dan sekarang ini mungkin saya telah berhasil menjawab pertanyaan dari beliau, ”WUISS”.

Oke, biar gak nunggu lama lagi, berikut Cara Memasang Widget Artikel Terkait Dengan Gambar:

1. Pertama masuk ke Akun Blogger anda

2. Masuk design kemudian edit HTML

3. Centang kotak kecil di kanan atas Expand Widget Templates

4. Untuk menghindari kesalahan sebaiknya download template anda dulu

5. Setelah itu letakkan kode di bawah ini di atas </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-->

Kalau sudah, cari kode berikut

<div class='post-footer'>

Dan letakkan kode di bawah ini di atas kode di atas

<!-- 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-->

 Nb_ Var maxresults=8 adalah jumlah artikel terkait yang muncul, silahkan di sesuaikan _ Anda bisa mengganti warna tulisan sesuka anda ( background-color:#d4eaf2;) background anda.

Script di atas saya dapatkan di http://www.kutulis.com/2012/04/cara-membuat-artikel-terkait-dengan.html

6. Simpan Template dan lihat Hasilnya

Cara Memasang Widget Artikel Terkait Dengan Gambar di Blogspot 9 Out Of 10 Based On 10 Ratings. 9 User Reviews.

Share 'Cara Memasang Widget Artikel Terkait Dengan Gambar di Blogspot' On ...

Anda baru saja membaca artikel yang berkategori Panduan Blog dengan judul Cara Memasang Widget Artikel Terkait Dengan Gambar di Blogspot. Anda bisa bookmark halaman ini dengan URL http://arioutsider69.blogspot.com/2012/08/cara-memasang-widget-artikel-terkait.html. Terima kasih!

Ditulis oleh: AriOutsider96 - Kamis, 23 Agustus 2012