[Tutorial] Cara Memasang Widget Recent Post dengan keterangan Gambar

[Tutorial] Cara Memasang Widget Recent Post dengan keterangan Gambar


Salam sapa blogger...
Alhamdulillah... pada hari ini dan detik ini masih diberikan nikmat hidup dan kesehatan, Semoga sobat juga dalam keadaan yang baik. :-)

Selain menggunakan Widget Related Post, untuk menambah minat pembaca juga dapat menggunakan Widget Recent Post. Widget Recent Post akan menampilkan 5 postingan atau artikel yang baru di posting ataupun beberapa postingan yang telah diposting sebelumnya. Tidak hanya itu, pada Widget ini juga dapat menampilkan gambar sehingga pembaca tertarik untuk membacanya. (Lihat contoh pada Homepage Blog ini)

Ingin mencobanya??Sangat mudah untuk memasangnya. Baiklah... ana akan mencoba mengulasnya. Berikut langkah-langkah
Cara Memasang Widget Recent Post dengan keterangan Gambar :

 1. Hal pertama yang harus dilakukan adalah  Log in blog => Dashboard => Tata Letak => Add A Gadget.

Selanjutnya  klik pada HTML/Javascript.

 2. Copy dan pastekan kode dibawah pada ruangan HTML/Javascript.
Jangan lupa untuk menukarkan  http://Url-Blog-Sobat/  dengan URL blog yang sobat miliki.


<script language="JavaScript">

imgr = new Array();



imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";


imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";


imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";


imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";


imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";

showRandomImg = true;

boxwidth = 270;


cellspacing = 8;


borderColor = "";


bgTD = "#000000";


thumbwidth = 40;


thumbheight = 40;


fntsize = 12;


acolor = "#fff";


aBold = false;


icon = " ";


text = "";


showPostDate = false;


summaryPost = 40;


summaryFontsize = 10;


summaryColor = "#666";


icon2 = " ";


numposts = 8;


home_page = "http://Url-Blog-Sobat/";


</script>


<script style='text/javascript'>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> </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>");document.write('');</script>

3. Langkah terakhir, klik Save dan Lihat hasilnya.


Demikian Cara Memasang Widget Recent Post dengan keterangan Gambar.
Selamat mencoba dan semoga berhasil... 
Jika terdapat kesalahan dalam kode mohon maaf dan mohon diberitahu kepada kami dengan berkomentar pada postingan ini.
Salam Sukses...

Share this

Related Posts

Previous
Next Post »

2 comments

Write comments
27 Agustus 2012 00.15 delete

Ini yang ditaruh di sidebar blog ya mas bro ??

Reply
avatar
27 Agustus 2012 21.50 delete

iya mas, liat di home page kami,.
bagian bawahnya.. itu contohnya mas, :D

Reply
avatar

Berkomentar lah dengan yang sopan yang tidak mengandung unsur SARA, PORNOGRAFI, Dan TIDAK diperkenankan untuk PROMOSI selain Persetujuan dari ADMIN. Jika di lakukan, Maaf komentar akan DI HAPUS.

Untuk menggunakan Emoticon Komentar, Klik Emoticon yang akan di pasang. Akan muncul kode emoticonnya. Masukkan itu pada saat berkomentar. Terima Kasih
EmoticonEmoticon