Cara Membuat Recent Post Per Label Fast Loading

Cara Membuat Recent Post Per Label Fast Loading - Hari ini saya akan berbagi tutorial blog tentang Cara Membuat Recent Post Per Label Fast Loading. Fast Loading saya tambahkan buat judul karena dalam membuat recent post per label ada juga yang mengunakan dengan RSS FEED, namun dalam pengamatan saya recent post model itu agak berat loadingnya, dan pada tutorial lain waktu insyaAllah akan saya posting juga panduannya.

Pada tutorial sebelumnya saya juga pernah berbagi tips Cara Membuat Recent Post Keren, namun recent post tersebut untuk keseluruhan artikel. Jadi bagi yang ingin membuat recent post hanya perlabel dan loadingnya juga cepat,berikut ini tutorialnya.

1. Login ke blogger
2. Pilih Tata Letak > Add Gadget > HTML/Javascript
3. Coy dan paste kode di bawah ini:

<style type="text/css">
/* RECENT POSTS LABEL */ 
/* Recent By Label */
.recent-by-tag img {float:left;width:60px;height:60px;margin-right:10px;margin-bottom:17px}
.recent-by-tag li {clear:both;line-height:1.3em !important}
.recent-by-tag li a{list-style:none;color:#555;font-weight:bold;font-size:14px !important}
.recent-by-tag li a:hover,.recent-by-tag li:hover a{color:#f35858 !important}
.recent-by-tag li .showdates{display:inline-block;font-size:10px;font-weight:normal;margin-top:5px;color:#aaa}
</style>
<script type='text/javascript'>
    var numposts = 10;
    var showpostthumbnails = true;
    var showpostdate = true;
 </script>
    <script type='text/javascript'>
    //<![CDATA[
    function rcentbytag(e){document.write('<ul class="recent-by-tag">');for(var t=0;t<numposts;t++){var n=e.feed.entry[t];var r=n.title.$t;var i;if(t==e.feed.entry.length)break;for(var o=0;o<n.link.length;o++){if(n.link[o].rel=="replies"&&n.link[o].type=="text/html"){var u=n.link[o].title;var f=n.link[o].href}if(n.link[o].rel=="alternate"){i=n.link[o].href;break}}var l;try{l=n.media$thumbnail.url}catch(h){s=n.content.$t;a=s.indexOf("<img");b=s.indexOf('src="',a);c=s.indexOf('"',b+5);d=s.substr(b+5,c-b-5);if(a!=-1&&b!=-1&&c!=-1&&d!=""){l=d}else l="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHqa1bV_gEP_HQpopwLQHLViheaD0WZ-f7R_imZVqaLGJ9U8W4khPIjhyphenhyphenet9g0Sa-7mNOngbhxnsC3WlVIFWSUV5Ae1QePdmA-kZow8Ns9_axnzrEnFGDKeHPOJsPtxYXEx6JBvHE93Fyq/s70-c/KM+Icon.png"}var p=n.published.$t;var v=p.substring(0,4);var m=p.substring(5,7);var g=p.substring(8,10);var y=new Array;y[1]="Januari";y[2]="Februari";y[3]="Maret";y[4]="April";y[5]="Mei";y[6]="Juni";y[7]="Juli";y[8]="Agustus";y[9]="September";y[10]="Oktober";y[11]="November";y[12]="Desember";document.write('<li class="clear">');if(showpostthumbnails==true)document.write('<a href="'+i+'" target ="_blank" title="'+r+'"><img class="rct-thumb" alt="'+r+'" src="'+l+'"/></a>');document.write('<strong><a href="'+i+'" target ="_blank" title="'+r+'" rel="nofollow">'+r+'</a></strong>');document.write('<br>');var x="";var T=0;if(showpostdate==true){x='<span class="showdates">'+x+g+" "+y[parseInt(m,10)]+" "+v+"</span>";T=1}document.write(x);document.write("</li>");if(t!=numposts-1)document.write("")}document.write("</ul>")}
    //]]>
    </script>
 <script>
var mql = window.matchMedia('screen and (min-width: 992px)');if (mql.matches){document.write("<script src=\"/feeds/posts/default/-/SEO?orderby=updated&amp;alt=json-in-script&amp;callback=rcentbytag\"><\/script>");}
</script>

4. Ganti tulisan semua-tutorialku.blogspot.com dengan alamat blog anda, ganti juga tulisan SEO dengan label post yang ingin ditampilkan.
5. Save dan lihat hasilnya.

Silahkan di coba dan bila ada kesulitan dalam mempraktekkan tutorial blog "Cara Membuat Recent Post Per Label Fast Loading", silahakn ajukan saja pertanyaannya pada kolom komen dibawah.