Cara Membuat Related Post Thumbnail dan Kotak Feedburner

Cara Membuat Related Post Thumbnail dan Feedburner - Yosh, kalo kemaren udh posting artikel Cara Verifikasi Komentar OpenID di Blog, kali ini saya akan membahas Cara Membuat Related Post Thumbnail dan Feedburner, script kali ini saya dapatkan dari blog http://www.hack4rt.us/. Widget ini terletak di bawah postingan, sebenernya saya masih ingin berbincang-bincang dengan kalian, tapi karena waktu yg terbatas, jadi tidak bisa karena kompi sdg rusak :v , untuk demonya silahkan lihat dibawah postingan ini.
Berikut tutorialnya :

1. Buka blogger

2. Pada Dashboard klik Template -> lalu klik Template HTML

3. Copy kode dibawah ini dan taruh tepat di atas kode ]]</b:skin>

.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden}
.clearfix{display:inline-block}
#related{background:#F0F2F5; border:1px solid #aaa;margin:0 0 5px;padding:10px}
ul#related-posts{font:bold 11px Arial;list-style:none;text-transform:none;margin:10px 0;padding:0}
#related .related-posts{font-weight:400;width:50%;float:right}
#related .related-posts p{font:bold 14px Arial;margin:0}
ul#related-posts li{float:left;height:auto;list-style-type:none;margin:0 5px;padding:2px 1px}
*html ul.rp#related-posts li{margin:0 13px}
ul#related-posts li a{-moz-box-shadow:0 1px 2px rgba(0,0,0,0.15);overflow:hidden;border:2px solid #aaa;display:block;height:72px;position:relative;width:72px;color:#fff;text-decoration:none;text-shadow:0 1px 0 #000;font:11px Arial}
ul#related-posts li .overlay{height:66px;line-height:16px;position:absolute;width:66px;z-index:10;padding:6px 0 0 6px}
ul#related-posts li a:hover .overlay{background:#000;display:block!important;opacity:0.7}
ul#related-posts li img{bottom:0;padding:0!important;max-width:100%;}
ul#related-posts li a:hover{-moz-box-shadow:0 1px 3px rgba(0,0,0,0.25)}
#related .subscribe{width:43%;float:left;color:#333;}
#related .subscribe p.intro{font-weight:400}
#related .subscribe p.feed{margin-bottom:10px;font-weight:700;padding-left:21px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtIxKGDHirfy-xNp2JGzGbDp53Fkndg0VGwy9ByYpy2FL6olPE1_bAg-oSAU-px0stWdCb57ggIW9M_lLaPIaMF9GRMD3lONA3t1wtZ7DftNC00wuskk1HDTNb0ISaBMwuC6mqqP5SBDI/s1600/feed+icon.gif) 0 50% no-repeat;vertical-align:middle} 

4. Copy kode dibawah ini dan letakan tepat dibawah kode ]]</b:skin>

<style>
  @media screen and (max-width:480px){
#related .subscribe{
display:none;
}
#related .related-posts{
width:100%
}
</style>

5. Copy kode dibawah ini dan letakan tepas dibawah kode <data:post.body/> (jika ada 2/3, cobalah satu satu)

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='clearfix' id='related'>
<div class='related-posts'>
<p>Related Articles</p>
<script type='text/javascript'>
var defaultnoimage=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQ-gANvDF4ZGO0jXZkcJSUKMKWvmAMekE8YI4U5IgmVW24cay43WpCK-fM9IgOc639Yy6Iu7K4Mo2FemyZOfJlLTYVHxzJSQY43VkaarykjZdbawI7baPcn7J2tNeMK56rhanrGJetass/s1600/no+image.jpg&quot;;
var maxresults=6;
</script>
<script src='http://js.hack4rt.us/relatedimg.js' type='text/javascript'/>
<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=6&quot;' type='text/javascript'/>
</b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
</script>            
</div>
<div class='subscribe'>
<p class='intro'>If you enjoyed this article just <a href='http://feeds.feedburner.com/sch-xp_blank' title='feedburner'>
<b>click here</b></a>, or subscribe to receive more great content just like it.</p>
<p class='feed'><a href='http://http://sch-xp.blogspot.com/feeds/posts/default' title='Subscribe'>Subscribe via RSS Feed</a></p>
<form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=sch-xp;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>
<input name='uri' type='hidden' value='JohnyTemplate'/>
<input name='loc' type='hidden' value='en_US'/>
<input id='botsub' name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Enter your email&quot;;}' onfocus='if (this.value == &quot;Enter your email&quot;) {this.value = &quot;&quot;;}' type='text' value='Enter your email....'/>
<input id='botsubbutton' type='submit' value='Submit'/><br/>
<small>Your information will not be shared. Ever.</small><br/>
</form>
</div>
</div>
    </b:if>

6. Klik simpan template

Pengaturan :
Ganti kode yg berwarna hijau dgn nama feedburner blog anda
Ganti kode yg berwarna merah dgn nama blog anda
Ganti kode yg berwarna oren dgn nama feedburner blog anda juga