Recent Post Thumbnail tanpa Java Script

Membuat Widget Recent Post atau bahasa lainya widget artikel terbaru. saya akan membagikan widget ini untuk sobat. Widget Recent post ini tidak menggunkan java script panggilan atau java script yang tidak di hosting, melainkan java scriptnya sudah di sertakan di dalam code widget tersebut jadi tidak memakan waktu loading yang lama. widget recent post ini di sertai gambar dan komentar.

DEMO

Untuk pemasangan widget

- Masuk ke account Blogger kalian,
- Dasbor pilih Tata letak
* Klik "Tambah Widget" dan pilih "HTML/JavaScript",

Copy kode berikut ini

<script language="JavaScript">
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCVmVu5X02MxP_8gBDN-pjBmAZLlpZRajVY7BLdmmy91YzMKxgzH2NfJmrFd4LbHYFkM82LOwU0-ONxRHxg8EAtWt4m4Rw88d9nD3ucfFsK6OUuaQukM4MW6H5IGT9lCqOUGK_5Ma1qrNp/s1600/no-images.jpg";
imgr[1] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCVmVu5X02MxP_8gBDN-pjBmAZLlpZRajVY7BLdmmy91YzMKxgzH2NfJmrFd4LbHYFkM82LOwU0-ONxRHxg8EAtWt4m4Rw88d9nD3ucfFsK6OUuaQukM4MW6H5IGT9lCqOUGK_5Ma1qrNp/s1600/no-images.jpg";
imgr[2] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCVmVu5X02MxP_8gBDN-pjBmAZLlpZRajVY7BLdmmy91YzMKxgzH2NfJmrFd4LbHYFkM82LOwU0-ONxRHxg8EAtWt4m4Rw88d9nD3ucfFsK6OUuaQukM4MW6H5IGT9lCqOUGK_5Ma1qrNp/s1600/no-images.jpg";
imgr[3] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCVmVu5X02MxP_8gBDN-pjBmAZLlpZRajVY7BLdmmy91YzMKxgzH2NfJmrFd4LbHYFkM82LOwU0-ONxRHxg8EAtWt4m4Rw88d9nD3ucfFsK6OUuaQukM4MW6H5IGT9lCqOUGK_5Ma1qrNp/s1600/no-images.jpg";
imgr[4] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCVmVu5X02MxP_8gBDN-pjBmAZLlpZRajVY7BLdmmy91YzMKxgzH2NfJmrFd4LbHYFkM82LOwU0-ONxRHxg8EAtWt4m4Rw88d9nD3ucfFsK6OUuaQukM4MW6H5IGT9lCqOUGK_5Ma1qrNp/s1600/no-images.jpg";
showRandomImg = true;
boxwidth = 285;
cellspacing = 5;
borderColor = "transparent";
bgTD = "#000000";
thumbwidth = 70;
thumbheight = 65;
fntsize = 11;
acolor = "#666";
aBold = true;
icon = " ";
text = "Komentar";
showPostDate = true;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 9;
home_page = "http://boyrohman.blogspot.com/";
</script>

<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){if(strx.indexOf("<")!=-1){var s=strx.split("<");for(var i=0;i<s.length;i++){if(s[i].indexOf(">")!=-1){s[i]=s[i].substring(s[i].indexOf(">")+1,s[i].length);}}strx=s.join("");}chop=(chop<strx.length-1)?chop:strx.length-2;while(strx.charAt(chop-1)!=' '&&strx.indexOf(' ',chop)!=-1)chop++;strx=strx.substring(0,chop-1);return strx+'...';}function showrecentposts(json){document.write('<table width="'+boxwidth+'" border=0 bordercolor="#FF0000" align="left" cellspacing="'+cellspacing+'" bgcolor="'+borderColor+'">');j=(showRandomImg)?Math.floor((imgr.length+1)*Math.random()):0;img=new Array();for(var i=0;i<numposts;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var pcm;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break;}}for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){pcm=entry.link[k].title.split(" ")[0];break;}}if("content"in entry){var postcontent=entry.content.$t;}else if("summary"in entry){var postcontent=entry.summary.$t;}else var postcontent="";postdate=entry.published.$t;if(j>imgr.length-1)j=0;img[i]=imgr[j];s=postcontent;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!=""))img[i]=d;cmtext=(text!='no')?'<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>':'';var month=[1,2,3,4,5,6,7,8,9,10,11,12];var month2=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];var day=postdate.split("-")[2].substring(0,2);var m=postdate.split("-")[1];var y=postdate.split("-")[0];for(var u2=0;u2<month.length;u2++){if(parseInt(m)==month[u2]){m=month2[u2];break;}}var daystr=(showPostDate)?'<i><font color="'+acolor+'"> - ('+day+' '+m+' '+y+')</font></i>':"";posttitle=(aBold)?"<b>"+posttitle+"</b>":posttitle;var trtd='<tr><td><img src="'+img[i]+'" width="'+thumbwidth+'" height="'+thumbheight+'"/></td><td style="font-size: 12px;">'+icon+'<a href="'+posturl+'">'+posttitle+'</a> - <span style="font-size: 9px; color: #616161;'+cmtext+' </span></td></tr>';if(summaryPost==0){trtd='<tr><td><img src="'+img[i]+'" width="'+thumbwidth+'" height="'+thumbheight+'"/></td><td>'+icon+'<a href="'+posturl+'">'+posttitle+'</a></td></tr>';}document.write(trtd);j++;}document.write('</table>');}document.write("<script src=\""+home_page+"feeds/posts/default?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts\"><\/script>");
//]]>
</script>

Silahkan sobat kreasikan sendiri, untuk tulisan yang berwarna silahkan sobat ganti sendiri misalkan transparent sobat ganti dengan kode warna #FFFFFF dan dan kode #000000 silahkan di sesuaikan. untuk angka 70 dan 65 merupakan lebar dan tinggi gambar, ganti http://boyrohman.blogspot.com/ dengan alamat blog sobat.

Silahkan Mencoba dan semoga bermanfaat.

Judul: Recent Post Thumbnail tanpa Java Script; Ditulis oleh Unknown; Rating Blog: 5 dari 5