Cara Membuat Related Posts Blogger Dengan Slideshow

Cara Membuat Related Posts Atau Artikel Terkait Blogspot dengan Gambar berjalan atau slideshow memang agak memberatkan loading kemungkinan namun untuk yang doyan deperti saya yah saya gunakan aja.
ikuti langkah berikut.

Edit your template, 

Log in to your blogger dashboard
Klick on Design - Edit HTML
and check the Expand Widget Templates.
Cari code:

</head>

Ganti Dengan kode ini

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related-posts {float:center;height:100%;min-height:100%;padding-top:5px;padding-left:5px;}
#related-posts h2{font-size: 1.6em;font-weight: bold;color:#000;font-family:Arial, Georgia;margin-bottom:0.75em;margin-top: 0em;padding-top: 0em;}
#related-posts a{-webkit-transition: background 1s ease, color 1s ease;-moz-transition: background 1s ease, color 1s ease;-o-transition: background 1s ease, color 1s ease;}
#related-posts a:hover{background-color:#d4eaf2;-webkit-transition: background 1s ease, color 1s ease;-moz-transition:background 1s ease, color 1s ease;-o-transition:background 1s ease, color 1s ease;-webkit-border-radius: 5px;-moz-border-radius:5px;border-radius:5px;-o-border-radius:5px;}
.tooltip{width: 115px; color:#000;font:lighter 12px/1.3 Arial,sans-serif;text-decoration:none;text-align:left}
.tooltip span.top{padding:20px 5px 0;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9blK5LQ7fTW8rVnY_yJT_MLTE4_8aMwkQTQvb3b_3aqgB9ToQNoy5hIFeSDGxv3MdR5rDKY9IcsRSX99Do3daKi8l-H3B78Yttt17cQ7f3W8efWTtGCSgo6sPQ2SgBhJrvXkY5qum-IA/s1600/bt.png) no-repeat top;}
.tooltip b.bottom{padding:2px 5px 6px;color:#548912;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9blK5LQ7fTW8rVnY_yJT_MLTE4_8aMwkQTQvb3b_3aqgB9ToQNoy5hIFeSDGxv3MdR5rDKY9IcsRSX99Do3daKi8l-H3B78Yttt17cQ7f3W8efWTtGCSgo6sPQ2SgBhJrvXkY5qum-IA/s1600/bt.png) no-repeat bottom;}
</style>
<script type='text/javascript'>window.onload=function(){enableTooltips("calcList")};imgBT=new Image();imgBT.src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiDsu4ttxI3OoTWxkrdz4gVHXqBHvXX-03fxuW6ORHt7LatfadEWQLddimM6ADHMWCyrfMybOg9AE4l7lodLSfUpYMdYPqO-y2Hj7koYGTO1EI5en3F11BJjtNy7SzsNOD2oUW0C7LILs/s1600/noimage.jpg';</script>
<script src='http://dvslabs.googlecode.com/files/rp-bubbled-thumbnails.js' type='text/javascript'></script>
</b:if>
</head> 

Next, Cari kode :

<div class='post-footer-line post-footer-line-1'>

atau

<p class='post-footer-line post-footer-line-1'>

simpan kode ini 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=12&quot;' type='text/javascript'/></b:if></b:loop>
<h3>Related Posts</h3>
<marquee align='center' behavior='alternate' direction='left' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='2' width='100%'>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=10;
var relatedpoststitle=&quot;&quot;;
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script></marquee>
</div><div style='clear:both'/>
</b:if>

Save your template and you're done. Anda bisa mengganti jumlah postingan maksimal 20 posts, dengan merubah angka merah (10) dan selamat mencoba,Sumber    intert3chmedia.net