Cara Membuat Related Post dengan Thumbnails

|| || ,,, || Leave a komentar

Trik dan tips kali ini akan membahas cara membuat related post dengan thumbnails. Related Post atau Artikel Terkait digolongkan berdasarkan jenis kategori atau label pada posting kita. Artikel terkait ini akan kita letakan dibawah posting. Artikel Terkait juga akan disertai Thumbnails horizontal dan Judul Blog. Fungsi dari related post yaitu menyajikan informasi lain yang berkaitan dengan artikel yang kita baca. Saya kebetulan memperoleh widget ini dari situs Indahnya Berbagi. Jika ingin membuatnya langsung saja menuju TKP:

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/amatullah83/js-indahnyaberbagi/relatedpostwiththumbnails.js.js' type='text/javascript'/>
</b:if>

4. Cari salah satu kode berikut ini:
<div class='post-footer-line post-footer-line-3'>
atau <p class='post-footer-line post-footer-line-3'>
5. Setelah itu letakan kode dibawah ini, dibawah salah satu kode langkah ke.4
<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://amatulla83.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. Terakhir simpan template anda.

Semoga artikel ini bermanfaat!
Baca Juga : Anekahosting.com web hosting murah terbaik di indonesia
Baca Juga : Exploit Joomla - Remote Shell Upload Vulnerability [ com_fabrik ]
Baca Juga : Proxy Tercepat Di Indonesia

Title Post: Cara Membuat Related Post dengan Thumbnails
Rating: 100% based on 99998 ratings. 5 user reviews.
Author: Avia
Terimakasih sudah berkunjung di blog CyberAsk, Jika ada kritik dan saran silahkan tinggalkan komentar















Artikel Menarik Lainya :

/[ 0 komentar Untuk Artikel Cara Membuat Related Post dengan Thumbnails]\

Apa Komentar Anda..?