Cara Membuat Related Post Bergambar/Thumnail

Membuat Artikel Terkait Dengan Gambar/thumbnail Di Bawah Postingan-Lama rasanya sudah tak Update lagi tentang Blogging Tutorial,karna kesibukan kantor yang sangat menguras waktu saya,
 Artikel ini saya tulis karna kemarin saya cari Script yang Related Post diGoogle Search,dan rata-rata Script yang dibagikan sudah 90% telah kena banned dan belum di Update oleh pemilik blognya,entah tidak melihat atau memang hanya copast saja aku tidak tau.

 Oke to the Point,Caranya cukup simpel Petama masukkan kode berikut tepat diatas kode </head>:
<!-- Cob22.Blogspot.Com Related Posts with thumbnails Scripts and Styles Start-->
<!-- remove --><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;
font-size
}

#related-posts h2{
font-size: 1.4em;
font-weight: bold;
color: black;
font-family: Georgia;
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:#E0F8E0;
}
</style>
<script type='text/javascript'>
var defaultnoimage=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4u-mmr8ALHgz8aoZeaZvuQFEhpjKtwiirtQoVv5dX3gHKOBJygkUCLpL0MDZE86xTlkP78STbI8tJiTQLUUsuM8P_KCVByURKjlifwYr63TLLck0XKr6LZW6oTvTbva4ne7eYixvz2as/s400/noimage.png&quot;;
var maxresults=5;
var splittercolor=&quot;#d4eaf2&quot;;
var relatedpoststitle=&quot;&quot;;
</script>
<script src='http://javascriptbtsnts.googlecode.com/files/btsnts-related-posts004.js' type='text/javascript'/>
<!-- remove --></b:if>
<!--Cob22.Blogspot.ComRelated Posts with thumbnails Scripts and Styles End-->
 NB:Tulisan berhuruf tebal diatas adalah script terbaru
 Next Step:Silahkan Centang Dulu Expand Widget Templates,Lalu Cari kode berikut <div class='post-header-line-1'/> Atau
    <div class='post-body entry-content'>
Paste kode dibawah ini tepat di bawah kode tersebut:
 <!-- Related Posts with Thumbnails Code Start-->
<!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'>




<div id='related-posts'>
<h2>Lihat Lainnya:</h2>
<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=7&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>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://www.helperblogger.com/2012/01/related-posts-widget-with-thumbnail-for_22.html'><img alt='Related Posts Widget For Blogger with Thumbnails' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9njsSujKaGuzS8lobqL2vAkrvi9zKl6wT7vRvkL1Mqf3Fpo7awMboUqyt_bB_D9e9-4L14zzjRcLSpOJvjNQrzQd6yNACJP2gg_HJ_Wpd_pE67YuwU4vsyKBSh7M9Jmmy9pYvBmCkU58/h120/hepler-blogger-related-posts.png' style='border: 0'/></a><a href='http://helperblogger.com/'><img alt='Blogger Tutorials' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZd-5HrOzuX_ANfNwBAjMamMthqWIWNUpIMaXOo-lpdkaENUkzhR4L9F9QkfiMw0bxLtCMQyo6rVP5MBFo289g4ya4FGpjiSwAotjl697SRtcgGCOUt30IfRs6Gi21Y603Iyzs3NBpDkU/h120/helper-blogger-related-posts1.png' style='border: 0'/></a>
</b:if></b:if>
<!-- Related Posts with Thumbnails Code End-->

Sekarang thap terkhir,silahkan berdoa dulu ya,ucap Amin mudah-mudahan berhasill,lalu klik save,
The End
hehehehe
Share atau Comment ya,tapi jangan SPAM,pasti saya Approve coment anda

0 komentar:

Posting Komentar