Cara Membuat Related Post Dengan Thumbnail Di Blog

Muhammad Agiel Kamali

Blogger

Jumat, 05 Juli 2013

1 Komentar

Cara Membuat Related Post Dengan Thumbnail Di Blog - Pada pagi hari ini saya akan berbagi sedikit artikel dan pembahasan kita kali ini akan membahas cara membuat related post dengan thumbnail di blog. Related post dengan thumbnail biasanya terdapat di bawah postingan atau artikel, related post dengan thumbnail adalah postingan terdahulu serta dilengkapi dengan gambar. Apakah anda tertarik membuatnya untuk dipasangkan di blogger anda? jika jawabannya iya, ikuti langkah-langkah dibawah ini.

1. Masuk ke blogger.
2. Pilih template.
3. Pilih edit html.
4. Cari kode dibawah ini.

</head>

5. Salin kode dibawah ini dan taruh kode tersebut diatas kode tadi.

<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://kangdansen.googlecode.com/files/relatedpostwiththumbnail.js' type='text/javascript'/>
</b:if> 

6. Kemudian, anda bisa cari kembali kode dibawah ini.

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

7. Salin kembali kode dibawah ini dan taruh dibawah kode tadi.

<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://www.omseoli.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;Postingan Terkait Tutorial Seo Blog&quot;;
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div style='clear:both'/>
</b:if> 

8. Simpan.

Share

Like

G+

Tweet

Tweet