Saturday, 10 April 2010

Membuat Recent Comment Dengan 2 Cara

Sekedar melengkapi tutorial yang ada di blog ini juga untuk sobat yang belum tahu tentang bagaimana cara membuat Recent Coment alias Komentar Terakhir.

Recent comment atau komentar terbaru adalah sebuah fungsi untuk menampilkan komentar terbaru secara real-time pada blog kita. Jadi jika ada pengunjung yang berkomentar di postingan kita maka kita bisa langsung tahu dan bisa langsung untuk menanggapinya. Cara ini sangat berguna bagi blog yang mempunyai traffic tinggi dan sering mendapat komentar.

Sebenarnya ada cara lain untuk mengetahui komentar masuk yaitu dengan fasilitas pemberitahuan komentar via email yang disediakan oleh blogger. Namun cara ini juga kurang efektif karena kita harus selalu login ke email untuk mengeceknya.


Yok Langsung lihat tutorialnya,silahkan dipilih!! Ada dua cara:

1. Membuat Recent Comment Via JavaScript

Untuk bisa memasukan recent comment via JavaScript, silakan masuk ke Page Element dan Add a Page Element. Setelah itu pilih HTML/Javascript dan ketikan kode di bawah ini :



<ul><script style="text/javascript">
function showrecentcomments(json) {
for (var i = 0; i < 5; i++) {
var entry = json.feed.entry[i];
var ctlink;
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";

if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
ctlink = entry.link[k].href;
break;
}
}
ctlink = ctlink.replace("#", "#comment-");
var ptlink = ctlink.split("#");
ptlink = ptlink[0];
var txtlink = ptlink.split("/");
txtlink = txtlink[5];
txtlink = txtlink.split(".html");
txtlink = txtlink[0];
var pttitle = txtlink.replace(/-/g," ");
pttitle = pttitle.link(ptlink);
if ("content" in entry) {
var comment = entry.content.$t;}
else
if ("summary" in entry) {
var comment = entry.summary.$t;}
else var comment = "";
var re = /<S[^>]*>/g;
comment = comment.replace(re, "");
document.write('<li>');
if (comment.length < 50) {
document.write('<div style="font-size:90%;background-color: #E8EEFA;border: #C3D9FF 1px dashed;margin-right:5px">' + monthnames[parseInt(cdmonth,10)] + ' ' + cdday);
document.write(' - ' + entry.author[0].name.$t + ' membalas di');
document.write(' ' + pttitle + ':</div>');
document.write(comment);
}
else
{
comment = comment.substring(0, 50);
var quoteEnd = comment.lastIndexOf(" ");
comment = comment.substring(0, quoteEnd);
document.write('<div style="font-size:90%;background-color: #E8EEFA;border: #C3D9FF 1px dashed;margin-right:5px">' + monthnames[parseInt(cdmonth,10)] + ' ' + cdday);
document.write(' - ' + entry.author[0].name.$t + ' berkomentar di');
document.write(' ' + pttitle + ':</div>');
document.write(comment + '...<a href="' + ctlink + '">(lanjut)</a>');
}
}
document.write('</li>');
}
</script>
<script src="http://nama blog.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments">
</script></ul>
<noscript>You need to enable JavaScript to read this.</noscript>


Dan untuk nama blog harus diganti dengan milik Anda. Mudah kan? Jika hasilnya kepanjangan silahkan dibuat scroll, kalo belum tahu caranya silahkan kesini: Membatasi Text, Gambar, Widget , dll dengan Overflow 

Kelebihan Yang Menggunakan java script ? ia dapat menampilkan nama pengomentar, posting yang dikomentari, tanggal mengomentar, Dan ada read more komentarnya. ini lebih Keren dari yang dibawah, atau yang menggunakan feed.
Begini nih Reviewnya:


2. Cara Membuat Recent Comment Via Feed
    a. Pada menu Blogger. Klik Layout -> Page elements
    b. Klik Add a Gadget lalu klik Feed
    c. Pada kotak "Feed Url" masukkan
http://YOURSITE.blogspot.com/feeds/comments/default


recent-posts-feed.gif


Ingat:
Ganti tulisan yang dicetak tebal dengan nama blog anda

    d. Setelah itu, klik Continue kemudian akan muncul preview komentar anda.
    e. Ganti titlenya jika perlu, jika tidak silahkan klik Save
    f. Selesai. Sekarang kotak recent commentnya sudah muncul diblog anda

Kaloyang ini hanya menampilkan komentar saja. lebih simple, tapi tampilan lebih bagus bila menggunakan yang java script. Tapi kelebihannya, bila pengunjung mengunjungi blog anda dengan tidak mengaktifkan java script,atau pengunjung yang menggunakan hp yang tidak mendukung java script sebagai browser, maka recent comment tetap terlihat.

Jadi pilih Yang Mana?

Ada Yang Punya Tutorial lainya? Silahkan sampaikan di komentar!!

5 comments:

  1. Makasih ya sobat atas postingannya....Moga2 aja bisa naik kelas lagi dah...Aku coba dulu ya....

    ReplyDelete
  2. kalo bikin posting terakhir yg kay di blog ini macam mana??

    ReplyDelete
  3. yo'i sama-sama, makasih juga kunjungannya!!

    ReplyDelete