Skip to main content

Membuat Recent Comment dengan JavaScript


Jika kita memiliki sebuah blog dengan pengunjung yang berjibun dan postingan yang banyak, tentunya sangat kerepotan untuk membalas komentar yang masuk, apalagi untuk posting yang sudah lama. Tidak mungkin kita memerikas satu-persatu isi komentar pada setiap postingan. Nah, kerepotan itu tidak akan terjadi jika kita memasang Recent Comment atau Komentar Terbaru di blog kita.

Untuk memasangnya, terdapat sekurang-kurangnya dua cara; yakni dengan menggunakan url feed comment blog kita atau dengan menggunakan JavaScript. Dan postingan kali ini, kita akan sharing cara yang kedua, yakni membuat Recent Comment dengan JavaScript.

Langkah-langkahnya :

  • Masuk DASBOR, TATA LETAK, lalu ELEMEN HALAMAN, pilih HTML/JavaScript.

  • Copy-paste JavaScript berikut di ELEMEN HALAMAN tadi



<script style="text/javascript">
function showrecentcomments(json) {
for (var i = 0; i < numcomments; i++) {
var entry = json.feed.entry[i];
var alturl;

if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
alturl = entry.link[k].href;
break;
}
}
alturl = alturl.replace("#", "#comment-");
var postlink = alturl.split("#");
postlink = postlink[0];
var linktext = postlink.split("/");
linktext = linktext[5];
linktext = linktext.split(".html");
linktext = linktext[0];
var posttitle = linktext.replace(/-/g," ");
posttitle = posttitle.link(alturl);
var commentdate = entry.published.$t;
var cdyear = commentdate.substring(0,4);
var cdmonth = commentdate.substring(5,7);
var cdday = commentdate.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";
var comment = entry.content.$t;
var alamat = entry.author.$t;
var re = /<\S[^>]*>/g;
comment = comment.replace(re, "");
if(entry.author[0].uri){
var uri = entry.author[0].uri.$t;
var urilink = uri.split(":");
urilink = urilink[0];
if (urilink != "http") var uri = "http://" + entry.author[0].uri.$t;
}
else {
var uri = false;
}

if(uri){
if (showcommentdate == true) document.write('<div class="komentar-terbaru">' + '<div class="yang-komentar">' + entry.author[0].name.$t + '</div>');
if (showposttitle == true) document.write('&nbsp;on ' +'<div class="judul">'+ posttitle +'</div>');
document.write(':<br/>'+'</div>');
if (comment.length < numchars)
document.write('<div class="isi">' + comment + '</div>');
else
document.write('<div class="isi">'+ comment.substring(0, numchars) + '...'+'</div>' );
}

else {
if (showcommentdate == true) document.write('<div class="komentar-terbaru">' + '<div class="yang-komentar">' + entry.author[0].name.$t + '</div>');
if (showposttitle == true) document.write('&nbsp;on ' +'<div class="judul">'+ posttitle +'</div>');
document.write(':<br/>'+'</div>');
if (comment.length < numchars)
document.write('<div class="isi">' + comment + '</div>');
else
document.write('<div class="isi">'+ comment.substring(0, numchars) + '...'+'</div>' );
}
}
}</script><script style="text/javascript">var numcomments = 9;var showcommentdate = true;var showposttitle = true;var numchars = 100;</script><script src="http://bahauddin-amyasi.blogspot.com/feeds/comments/default?max-results=10&alt=json-in-script&callback=showrecentcomments"></script>


Catatan:
Ubah bahauddin-amyasi.blogspot.com dengan nama blog anda.
Angka 10 menunjukkan komentar yang akan ditampilkan, silahkan rubah sesuai keinginan anda.


  • Setelah selesai copy-paste, silahkan disimpan dulu.

  • Lalu kembali ke TATA LETAK, terus EDIT HTML.

  • Copy kode CSS berikut, lalu paste sebelum kode ]]></b:skin>



/* Komentar Terbaru */
.isi {
padding-bottom:10px;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size:11px;
padding-left:17px;
}

.judul {
display:inline;
text-transform:capitalize;
}

.yang-komentar {
display: inline;
font-weight:bold;
}

.komentar-terbaru {
padding: 2px 0 2px 17px ;
border-top:1px solid #809fbd;
border-bottom: 1px solid #809fbd;
background: #D3DFE9 url(http://bp3.blogger.com/_KL7_V6HnzdI/RhrL4XaiIhI/AAAAAAAAANo/LArJfJFOEw0/s400/blue.gif) no-repeat 2px 6px;
}



  • Jangan lupa disimpan dan lihat hasilnya


Catatan :
Silahkan rubah http://bp3.blogger.com/_KL7_V6HnzdI/RhrL4XaiIhI/AAAAAAAAANo/LArJfJFOEw0/s400/blue.gif dengan link gambar anda.

Happy blogging....

Popular posts from this blog

HUMAN RELATION ; Perspektif Psikologi Humanistik, Fungsionalisme dan Behaviorisme (Sebuah Kajian Analitis-Interkonektif)*

Pendahuluan
Human Relation, merupakan hubungan atau kerjasama antara dua individu atau lebih, khususnya dalam status hubungan atau interaksi social. Buruk atau baiknya human relation dapat diukur dari adanya kepercayaan yang bersifat timbal balik antara satu orang dengan orang lain serta dari adanya sebuah penghormatan atau penghargaan dan rasa tolong menolong yang kokoh. Bukan menjadi keraguan lagi bahwasanya human relation menjadi suatu keinginan yang sangat primordial bagi setiap yayasan atau sebuah organisasi, bahkan menjadi syarat utama dari terealisasinya tujuan-tujuan serta pencapaian visi dan misi sebagai kunci kesuksesan organisasi pada umumnya.

Human relation sering disebut juga dengan “interpersonal relation”, yaitu kerjasama sekelompok individu dari masyarakat social yang tumbuh dari adanya hubungan antara satu individu dengan individu yang lain. Interpersonal relation merupakan sebuah deskripsi yang jelas tentang tata pergaulan atau tingkah laku manusia dan karakteristik pr…

Kumpulan Novel Jar (untuk HP Aplikasi Java)

Bagi para novel mania, membaca novel tentunya adalah kesenangan tersendiri. Semacam interaksi personal dengan dunia imaji yang kerap menghentak-hentak ambisi. Di dunia maya, kita banyak menjumpai situs-situs yang menyediakan novel dengan berbagai format dan ekstensinya. Ada format PDF (portable document format), yang dapat dibuka dengan program Acrobat Reader atau sejenisnya. Ada juga yang dengan bentuk format htm, yang dapat dibuka dengan browsing atau internet eksplorer secara offline. Ada juga yang berbentuk format exe. Ada juga yang menggunakan windjvu-viewer (untuk membuka file extensi *.djv / *.djvu). Ada format "lit Viewer"(untuk membuka file extensi *.lit). Dan banyak "ada juga-ada juga" yang lain...

Tapi, pada postingan kali ini, saya akan berbagi lagi dengan sobat sekalian tentang Novel HP (aplikasi java). So, bagi sobat yang punya hobbi ngoleksi novel, tetapi jarang online dan tidak punya komputer, jangan khawatir. Berkat kecerdasan teknologi, kita yang …

Download Alfiyah MP3

Di kalangan pondok pesantren, nama Ibnu Malik dan Kitab Alfiyah adalah dua entitas yang sudah tidak asing lagi, terlebih bagi pondok pesantren salaf yang setiap harinya bergumul dengan kitab kuning dan tata gramatika bahasa Arab (Nahwu & sharrof). Di pondok saya sendiri, Mambaul Ulum Bata-bata, Pamekasan, Madura, kitab Alfiyah Ibnu Malik menjadi Kitab standart acuan dalam pembelajaran Kaidah bahasa Arab, dan menjadi syarat pelulusan ke tingkat Aliyah B, yang orientasinya memang menitik beratkan pada kajian kitan klasik.

Pada malam-malam tertentu, para santri diwajibakan membaca nadham (bait-bait) Alfiyah dengan bersama-sama, dengan lagu dan irama yang bermacam-macam. diharapkan, dengan tradisi pembacaan Alfiyah secara rutin dan intens, santri mamapu menhafal dan memahami isi kandungan kitab Alfiyah ini dengan baik dan mudah.

Di era teknologi dan informasi yang serba canggih ini, kitab Alfiyah dan kitab-kitab kuning lainnya sudah tidak dipelajari secara manual dan klasikal, tetapi …