membuat widget resent post 5

Mungkin sudah banyak yang share artikel tentnag cara membuat recent post ini d blog-blog terkenal :3 . Tapi di sini saya membuat tampilannya berbeda, tampilannya mirip dengan Widget Recent Post by Label di blog saya.

Nah buat kalian yang ingin memasang widget artikel terbaru ini silahkan ikuti tutorial dibawh ini :)

Memasang Widget New Post di Blog

Setelah login pilih menu Tataletak, Terus Tambahkan Widget, Cari HTML/Javascript, contoh lihat gambar

Gambar Tataletak Widget Html / Javascript

Setelah Ketemu, Klik Tanda Plus Lalu Masukan Script Widget Artikel Terbaru Dibawh ini kedalamnya


<script type="text/javascript">
//<![CDATA[
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('J.19=B(){6 a=B(a){6 b=a||{},c=b.1a||"",d=b.1b||5,e=b.1c||"#1d",f=b.1e||1f,g=b.1g||1h,h=b.1i||"1j",i=b.1k||"P",j=b.1l||"1m",k=b.1n||"Q P",l=b.1o||["1p","1q","1r","1s","1t","1u","1v","1w","1x","1y","1z","1A"],m=b.1B||" 1C:1D/1E;1F,1G=";$(e).1H(h);6 n=c;""===c&&(n=J.R.1I+"//"+J.R.1J),$.1K({T:n+"/1L/1M/1N?U=1O-E-1P&1Q=V&1R-1S="+d,W:"1T",1U:"1V",1W:B(a){6 b,c,d,n,o,p,q,r,s,t,u,v="",w=a.1X.1Y;K(1Z 0!==w){v="<X 3=\'20\'>";L(6 x=0;x<w.F;x++){L(6 y=0;y<w[x].A.F;y++)K("21"==w[x].A[y].Y){b=w[x].A[y].M;Z}L(6 z=0;z<w[x].A.F;z++)K("22"==w[x].A[z].Y&&"23/G"==w[x].A[z].W){d=w[x].A[z].C.24(" ")[0];Z}o="11"E w[x]?w[x].11.$t:"12"E w[x]?w[x].12.$t:"",p="13$14"E w[x]?w[x].13$14.T.15(/\\/s[0-9]+\\-c/g,"/s"+f):m,n=0===d?\' <2 3="N">\'+k+"</2>":1===d?\' <2 3="N">\'+d+" "+j+"</2>":\' <2 3="N">\'+d+" "+i+"</2>",o=o.15(/<\\S[^>]*>/g,""),o.F>g&&(o=o.D(0,g)+"..."),c=w[x].C.$t,q=w[x].V.$t.D(0,10),r=q.D(0,4),s=q.D(5,7),t=q.D(8,10),u=l[25(s,10)-1],v+=\'<16 3="26" ><H 3="27"><a C="\'+c+\'" M="\'+b+\'" 17="18"><28 C="\'+c+\'" U="\'+c+\'"29="\'+p+\'"/></a></H><I 3="2a"><a C="\'+c+\'" M="\'+b+\'" 17="18">\'+c+\'</a></I><H 3="2b"><2 3="2c"><2 3="2d">\'+t+\'</2> <2 3="2e">\'+u+\'</2> <2 3="2f">\'+r+"</2></2>"+n+"</H><p>"+o+"</p></16>"}v+="</X>",$(e).G(v).O(h)}2g $(e).G("<2>Q 2h!</2>").O(h)},2i:B(){$(e).G("<I>2j 2k 2l!</I>").O(h)}})};2m B(b){a(b)}}();',62,147,'||span|class|||var||||||||||||||||||||||||||||||link|function|title|substring|in|length|html|div|strong|window|if|for|href|komen|removeClass|Comments|No|location||url|alt|published|type|ul|rel|break||content|summary|media|thumbnail|replace|li|target|_blank|new_post|url_blog|numberofposts|id_contain|isina|imagesize|40|snippetsize|100|loadingClass|tungguan|commentstext|firstcmtext|Comment|NoCmtext|MonthNames|Jan|Feb|Mar|Apr|May|Jun|Jul|Aug|Sep|Oct|Nov|Dec|pBlank|data|image|png|base64|iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAABHNCSVQICAgIfAhkiAAAAA1JREFUCJljOHPmzH8ACDADZKbltQ8AAAAASUVORK5CYII|addClass|protocol|host|ajax|feeds|posts|default|json|script|orderby|max|results|get|dataType|jsonp|success|feed|entry|void|post_baru|alternate|replies|text|split|parseInt|jerona|gambar|img|src|judulna|tglncomen|date|dd|dm|dy|else|result|error|Error|Loading|Feed|return'.split('|'),0,{}))
//]]>
</script>
<style type="text/css">
#new_post{width:100%;margin:0 auto;position:relative;background:white;padding:8px;overflow:hidden;border:1px solid #f0f0f0}
#new_post .post_baru{width:100%;padding:0;margin:0 auto;position:relative}
#new_post .post_baru .jerona{font-size:12px;min-height:50px;margin:0 0 8px;padding:0 0 8px;border-bottom:1px dotted #f0f0f0;overflow:hidden;color:black;list-style:none}
#new_post .post_baru .jerona .judulna a{color:#333;line-height:1.4em;font-weight:500!important}
#new_post .post_baru .jerona p{font-size:12px;line-height:1.4em;font-weight:400;color:#333}
.date,.komen{display:inline-block;margin-right:8px}
.date:before{content:"\f073";font-family:FontAwesome;font-style:normal;font-weight:normal;text-decoration:inherit;padding-right:4px}
.komen:before{content:"\f086";font-family:FontAwesome;font-style:normal;font-weight:normal;text-decoration:inherit;padding-right:4px}
#new_post .post_baru .jerona:nth-child(1) .gambar{width:100%;max-width:300px;max-height:250px;padding:0;margin:0 auto;position:relative;overflow:hidden}
#new_post .post_baru .jerona:nth-child(1) .gambar img{width:100%;padding:0;margin:0 auto;position:relative}
#new_post .post_baru .jerona:nth-child(1) .judulna{display:block;width:100%;text-align:center;font-size:20px;margin:0 0 5px}
#new_post .post_baru .jerona:nth-child(1) .tglncomen{background:transparent;display:block;font-size:11px;font-weight:bold;color:#8D8D8D;text-transform:uppercase;text-align:center}
#new_post .post_baru .jerona:nth-child(n+2) .gambar{max-width:60px;max-height:60px;padding:0;margin:3px 8px 0 0;overflow:hidden;float:left;clear:both}
#new_post .post_baru .jerona:nth-child(n+2) .gambar img{width:60px;height:60px}
#new_post .post_baru .jerona:nth-child(n+2) .judulna{display:block;width:100%;font-size:15px;margin:0 0 5px}
#new_post .post_baru .jerona:nth-child(n+2) p{width:0;height:0;font-size:0;overflow:hidden;display:block;position:relative}
</style>
<div id="new_post"></div>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
  new_post({
    numberofposts: 5,
    id_contain: "#new_post",
    commentstext: "Comments",
    imagesize: 300,
    snippetsize: 100
  });
});
//]]>
</script>

numberofposts: 5, Jumlah Post Yang Akan Ditampilkan
imagesize: 300, Ukuran Gambar + Resolusi Gambar.
snippetsize: 100 Jumlah Deskripsi Yang Akan Ditampilkan.