Untuk membuat atau memasang gadget ini ke dalam blog anda sangatlah mudah, anda hanya perlu meng-CoPas (Copy Paste) ke dalam widget bertipe HTML/Javascript. Settingan defaultnya sudah cukup berfungsi dengan baik sehingga anda tidak perlu mengubah konfigurasi kode apapun, sehingga lebih mudah dan aman tentunya.
Untuk membuat atau memasang widget Recent Post dengan gambar thumbnail ini, ikuti langkah-langkah berikut:
- Masuk ke Blogger Dashboard anda dan pilih Blog yang anda inginkan
- Pilih Tata Letak
- Di dalam Tata Letak, klik Tambahkan gadget (lokasinya terserah anda, bisa anda tempatkan pada bagian sidebar ataupun pada bagian footer)
- Dari pilihan gadget yang ada, pilih HTML/Javascript dan masukkan kode berikut:
<div id="ndb-recentpost">
<script language="JavaScript">
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcoD4JfCY1OAWts7PsbqM2txmGlDkKHjmiaUtvGaEE1dSIRWg1nD8v8Wa1ikbX6s6LtELURHW9OH-FeXmVzQV2T3NmQXdcn_QZUHGwDjJe-2_RcRXaowGnpIFi-N3h_IWFIH4xpP6Q4ps/s400/noimage.png";
imgr[1] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcoD4JfCY1OAWts7PsbqM2txmGlDkKHjmiaUtvGaEE1dSIRWg1nD8v8Wa1ikbX6s6LtELURHW9OH-FeXmVzQV2T3NmQXdcn_QZUHGwDjJe-2_RcRXaowGnpIFi-N3h_IWFIH4xpP6Q4ps/s400/noimage.png";
imgr[2] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcoD4JfCY1OAWts7PsbqM2txmGlDkKHjmiaUtvGaEE1dSIRWg1nD8v8Wa1ikbX6s6LtELURHW9OH-FeXmVzQV2T3NmQXdcn_QZUHGwDjJe-2_RcRXaowGnpIFi-N3h_IWFIH4xpP6Q4ps/s400/noimage.png";
imgr[3] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcoD4JfCY1OAWts7PsbqM2txmGlDkKHjmiaUtvGaEE1dSIRWg1nD8v8Wa1ikbX6s6LtELURHW9OH-FeXmVzQV2T3NmQXdcn_QZUHGwDjJe-2_RcRXaowGnpIFi-N3h_IWFIH4xpP6Q4ps/s400/noimage.png";
imgr[4] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcoD4JfCY1OAWts7PsbqM2txmGlDkKHjmiaUtvGaEE1dSIRWg1nD8v8Wa1ikbX6s6LtELURHW9OH-FeXmVzQV2T3NmQXdcn_QZUHGwDjJe-2_RcRXaowGnpIFi-N3h_IWFIH4xpP6Q4ps/s400/noimage.png";
showRandomImg = true;
tablewidth = '100%';
cellspacing = 8;
borderColor = "#ffffff";
bgTD = "#ffffff";
imgwidth = 80;
imgheight = 80;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "no";
showPostDate = false;
summaryPost = 50;
summaryFontsize = 11;
summaryColor = "#666";
icon2 = " ";
numposts = 5;
home_page = 'http://' + fnGetDomain(window.location.href) + '/';
function fnGetDomain(url) {
return url.match(/:\/\/(.[^/]+)/)[1];
}
</script>
<script type='text/javascript'>
function removeHtmlTag(l,h){for(var e=l.split("<"),g=0;g<e.length;g++)-1!=e[g].indexOf(">")&&(e[g]=e[g].substring(e[g].indexOf(">")+1,e[g].length));e=e.join("");return e=e.substring(0,h-1)}
function showrecentposts(l){document.write('<table width="'+tablewidth+'" border=0 bordercolor="#FF0000" cellspacing="'+cellspacing+'" bgcolor="'+borderColor+'" align="center">');j=showRandomImg?Math.floor((imgr.length+1)*Math.random()):0;img=[];for(var h=0;h<numposts;h++){var e=l.feed.entry[h],g=e.title.$t,p,k;if(h==l.feed.entry.length)break;for(var f=0;f<e.link.length;f++)if("alternate"==e.link[f].rel){k=e.link[f].href;break}for(f=0;f<e.link.length;f++)if("replies"==e.link[f].rel&&"text/html"==
e.link[f].type){p=e.link[f].title.split(" ")[0];break}f="content"in e?e.content.$t:"summary"in e?e.summary.$t:"";postdate=e.published.$t;j>imgr.length-1&&(j=0);img[h]=imgr[j];s=f;a=s.indexOf("<img");b=s.indexOf('src="',a);c=s.indexOf('"',b+5);d=s.substr(b+5,c-b-5);-1!=a&&(-1!=b&&-1!=c&&""!=d)&&(img[h]=d);cmtext="no"!=text?'<i><font color="'+acolor+'">('+p+" "+text+")</font></i>":"";for(var e=[1,2,3,4,5,6,7,8,9,10,11,12],q="Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec".split(" "),r=postdate.split("-")[2].substring(0,
2),n=postdate.split("-")[1],t=postdate.split("-")[0],m=0;m<e.length;m++)if(parseInt(n)==e[m]){n=q[m];break}e=showPostDate?'<i><font color="'+acolor+'"> - ('+r+" "+n+" "+t+")</font></i>":"";g=aBold?"<b>"+g+"</b>":g;f='<tr><td valign="top" width="'+imgwidth+'" height="'+imgheight+'" style="background:'+bgTD+'"><a href="'+k+'"><img src="'+img[h]+'" width="'+imgwidth+'" height="'+imgheight+'"/></a></td><td style="background:'+bgTD+'" valign="top">'+icon+'<a href="'+k+'" style="color:'+acolor+"; font-size:"+
fntsize+'px;">'+g+"</a><br /> "+cmtext+" "+e+'<div style="color:'+summaryColor+"; margin-top:2px; border-top:1px "+borderColor+" solid; font-size:"+summaryFontsize+'px;">'+icon2+removeHtmlTag(f,summaryPost)+"...</div></td></tr>";0==summaryPost&&(f='<tr><td valign="top" width="'+imgwidth+'" height="'+imgheight+'" style="background:'+bgTD+'"><a href="'+k+'"><img src="'+img[h]+'" width="'+imgwidth+'" height="'+imgheight+'"/></a></td><td style="background:'+bgTD+'" valign="top">'+icon+'<a href="'+k+'" style="color:'+
acolor+"; font-size:"+fntsize+'px;">'+g+"</a><br /> "+cmtext+" "+e+"</td></tr>");document.write(f);j++}document.write("</table>");document.write('<a href="http://jasa-pembuatanweb.blogspot.com" style="font-size: 8px; text-decoration:none; color: #cccccc;">Blogspot Tutorial</a>')}document.write('<script src="'+home_page+"feeds/posts/default?max-results="+numposts+'&orderby=published&alt=json-in-script&callback=showrecentposts">\x3c/script>');
</script>
</div>
Simpan dan lihatlah hasilnya!
Sekarang pengunjung anda dapat melihat postingan terakhir anda tanpa harus masuk ke halaman beranda anda.