Cara Membuat Artikel Terkait Gambar Thumbnail

Artikel Terkait Thumbnails
Artikel Terkait Thumbnails
Apa kabar para sahabat blogger semua? semoga dalam keadaan sehat terntunya, amin
sebelumnya yang memiliki kesulitan dalam menambahkan artikel terkait di dalam template nya, sehingga artikel terkait tersebut tidak muncul dan apa yang sahabat pikirkan? pasti akan merasa kesal.

nah kali ini saya mau share sedikit tentang memasang artikel terkait di blog, yang mudah-mudahan cocok untuk semua jenis template sahabat

Untuk pemasangannya, silahkan ikuti langkah-langkah berikut ini:
1. Login diakun Blogger sobat,
2. Pada halaman Dasbor, pergi ke Template dan pilih Edit HTML,
3. Pada kotak editor template, sembarang klik disalah satu ‘box’ tersebut, dan
    tekan Ctrl + F, silahkan cari kode </head>  
4. Letakkan CSS dan JavaScript berikut ini sebelum 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.3em;
font-weight: bold;
color: #000000;
font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:#000000;
}
#related-posts a:hover{
color:#000000;
}
#related-posts a:hover {
background-color:#d6f5d3;
}
</style>
<script src='http://eflianda-blogzzz.googlecode.com/files/relatedthumbs.js' type='text/javascript'/>
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->
5. Setelah script di atas, cari kode <div class='post-footer'> atau
   <div class='post-footer-line post-footer-line-1'/>, letakkan script berikut di atas kode
    tersebut.
<!-- 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=6;
var relatedpoststitle=&quot;Artikel Terkait&quot;;
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div style='clear:both'/>
</b:if>
<!-- Related Posts with Thumbnails Code End-->
    Angka berwarna hijau adalah jumlah posting tampilan related post,
    sesuaikan dengan lebar Blog sobat.
6. Terakhir, klik Simpan Template.

2 comments

Post a Comment