membuat recent post dengan javascript

Jika dulu saya pernah memposting tutorial menampilkan recet post atau postingan terbaru di web atau blog khususnya blogger blogspot, kini saya akan memposting tutorial yang sama tapi dengan menggunakan javascript, tp sebelumnya kalo ingin menggunakan widget generator recent post klik disini, anda tingal klik langsung jadi alias ga usah repot2 manual, dan jika pengen melihat postingan cara membuat recent post yang default yang dulu pernah saya posting silahkan klik disini dan siapa tau bisa anda jadikan bahan pertimbangan yang mana yang nanti akan anda pilih..
Sekarang saya akan memberi tahukan apa keuntungan menggunakan cara yang ini, yaitu jumlah recent post yang bisa anda tampilkan akan bisa lebih banyak di bandingkan jika menggunakan recent post default blogger, yang mana jika anda menggunakan recent post default blogger maksimal recent postingannya cuman 5 postingan terbaru yang bisa tampil, sedangkan jika anda menggunakan cara yang ini ( menggunakan javascript ) postingan terbaru yang bisa di munculkan maksimal adalah 25 posting terbaru... Dan ditambah lagi kelemahan dari menggunakan recent post default blogger yaitu jika anda habis posting artikel recent post anda tidak akan keluar dengan langsung alias lama dan jika anda menggunakan cara ini recent post anda akan lebih cepat munculnya setelah anda melakukan posting...
Nah... setelah anda mengetahui apa kelemahan dan kekurangan dari masing masing selanjutnya terserah anda, ato bahkan anda ingin bercuap cuap yang lainnya disini juga monggo monggo mawon.. hehhe ( pake bahasa jawa dikit )
Ok... ga banyak kata lagi... langsung aja simak baik baik yah....
seperti biasanya disini saya akan memberikan script mentah dan mateng dan saya akan memberikan matengnya duluan... biar ntar pembaca jadi kenyang duluan... wekekkeke...
silahkan copy code script dibawah ini :


<script src="http://ekhan.gitar1stindo.googlepages.com/recentpost.js"></script>
<script>var numposts = 25; var showpostdate = false; var showpostsummary = false; var numchars = 100; </script>
<script src="http://ganti-dgn-blog-anda.blogspot.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rp">
</script>


sekarang masukkan script di atas di bagian sidebar atau yang lainnya pada blog anda yaitu dengan cara : masuk kehalaman LAYOUT kemudian tambahkan elemen halaman dengan cara ADD A GADGET / TAMBAHKAN GADGET, kemudian pilih lagi pilihan HTML/JAVASCRIPT .. dan setelah anda masukkan jangan lupa tekan SAVE / SIMPAN ...

Jika anda masih kurang puas dengan script yang sudah jadi dan sudah saya upload yaitu yg ini ( buka saja ini : http://ekhan.gitar1stindo.googlepages.com/recentpost.js ).. dan ingin anda miliki sendiri dan anda taruh ke web file hosting pilihan anda seperti ( www.googlepages.com, www.geocities.com, dan www.ripway.com ) maka copy lah script mentahan dibawah ini kemudian anda upload sendiri dengan ekstensi penyimpanan file adalah ( .js )

//credit to hoctro
function rp(json) {
document.write('<ol>');

for (var i = 0; i < numposts; i++) {
document.write('<li>');
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
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;
}
}

posttitle = posttitle.link(posturl);
var readmorelink = "(more)";
readmorelink = readmorelink.link(posturl);
var postdate = entry.published.$t;
var cdyear = postdate.substring(0,4);
var cdmonth = postdate.substring(5,7);
var cdday = postdate.substring(8,10);
var monthnames = new Array();
monthnames[1] = "Jan";
monthnames[2] = "Feb";
monthnames[3] = "Mar";
monthnames[4] = "Apr";
monthnames[5] = "May";
monthnames[6] = "Jun";
monthnames[7] = "Jul";
monthnames[8] = "Aug";
monthnames[9] = "Sep";
monthnames[10] = "Oct";
monthnames[11] = "Nov";
monthnames[12] = "Dec";

if ("content" in entry) {
var postcontent = entry.content.$t;
} else if ("summary" in entry) {
var postcontent = entry.summary.$t;
} else
var postcontent = "";
var re = /<\S[^>]*>/g;
postcontent = postcontent.replace(re, "");
document.write(posttitle);

if (showpostdate == true) document.write(' - ' + monthnames[parseInt(cdmonth,10)] + ' ' + cdday);

if (showpostsummary == true) {
if (postcontent.length < numchars) {
document.write(postcontent);
} else {
postcontent = postcontent.substring(0, numchars);
var quoteEnd = postcontent.lastIndexOf(" ");
postcontent = postcontent.substring(0,quoteEnd);
document.write(postcontent + '...' + readmorelink);
}
}
document.write('</li>');
}
document.write('</ul>');

}

Setelah script diatas anda upload di web file hosting milik anda dengan nama ekstensi fille ( .js ) maka tahap selanjutnya adalah copy alamat url file yang barusan anda upload tadi ( yang berekstensi ( .js ) tadi loh ) dan ganti code script dibawah ini yang saya kasih tanda kata kata berwarna :


<script src="http://ganti-dgn-alamat-url-file-yg-anda-upload-tadi.com/contoh-file.js"></script>
<script>var numposts = 25; var showpostdate = false; var showpostsummary = false; var numchars = 100; </script>
<script src="http://ganti-dgn-blog-anda.blogspot.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rp">
</script>


Dan taruh seperi cara yang diatas tadi [ klik disini untuk melihat cara yang tadi ]

Setelah itu... lihat hasilnya.....
gimana...? masih bingung..? moga aja nggak yah... coz udah saya coba jelaskan dengan sedetail detailnya... tapi kalo emank masih bingung, silahkan kayak teman teman yang lainnya yah... yinggalkan pesan pertanyaan di posting komentar dibawah ini, dan sekalian sambil beriklan posying koment... jadi lah yang nomor satu di urutan teratas pengomentar karena peluang blog anda akan di klik orang akan lebih banyak... sebelumnya... semoga sukses n sukses mengeblog...
Sampai jumpa..........

Posted by ayiek

Tweet