Header Ads

  • Terkini

    Tutorial Widget Komen Terbanyak Untuk Blogger Dengan Avatar

    Tutorial Widget Komen Terbanyak Untuk Blogspot Dengan Avatar

    Ini merupakan entri pertama saya dalam bab tutorial blog. Sebenarnya banyak yang hendak dikongsikan, tetapi disebabkan masa amat mencemburui, maka tak punya banyak kesempatan untuk post entri dalam bab ini.

    Tutorial pertama merupakan satu widget blogger yang menarik bertujuan untuk menggalakkan pembaca memberi komen di blog kita ialah "Top Commentator Widget" atau widget "Komentar Paling Banyak". Yang menariknya, widget ini akan memaparkan avatar (gambar profile pengkomen) dan bilangan komen yang diberikan.


    Realtime demo untuk blog ini adalah seperti di bawah:

    RAJIN KOMEN



    Kelebihan kod widget ini, kita tak perlu setkan blog URL kerana html kod akan 'auto-detect' blog URL kita. Widget ini telah diset untuk TIDAK memapar komen dari "Anonymous", manakala untuk membuang komen blog admin hendaklah memasukkan nick name blog admin dalam var excludeUsers = "Anonymous", "Blogger Username"] Setting lain adalah berdasarkan penerangan dari diberikan seperti berikut:

    // CONFIG:
    • var maxTopCommenters = 15; // berapa banyak senarai top commentator.
    • var minComments = 1; // minimum komen
    • var numDays = 0;  // komen sejak bila (ex. 30), atau 0 sejak dari mula. 
    • var excludeMe = true;  // true: tidak masukkan komen sendiri
    • var excludeUsers = ["Anonymous", "Blogger Username"];  // jangan masukkan username ini, tukar Blogger Username kpd nick name blogger anda.
    • var maxUserNameLength = 42; // 0: don't cut, >42: cut till 42 usernames characters 

    Untuk menukar saiz ikon avatar pengkomen, ubah kedua-dua saiz 30px pada baris ini:
    top-commenter-avatar {vertical-align:middle; height: 30px;width: 30px;

    Bagaimana memasang widget "Top commentators" untuk blogger? Ikuti langkat seperti berikut
    • Pergi ke Blogger Dashboard
    • Klik pada Layout tab
    • Klik Add Gadget dan pilih 'HTML/Javascript'
    • Salin kod di bawah ini dan paste kan dalam kotak berkenaan
    • Namakan widget anda, contohnya "Komentar Terbanyak" (ikut selera anda)
    (go to inside textarea - right click - select all - right click - copy)

    Klik "save" dan lihat perubahan pada blog anda.

    tags: blogging, widget, blogger widget, top commentator widget, blog tutorial

    80 comments:

    1. Cantik widget ni..
      Boleh cuba ni

      ReplyDelete
    2. bestlah widget nie, mesti cuba nie..

      ReplyDelete
    3. terima kasih perkongsian { http://jmbelog.blogspot.com/2013/04/1st-anniversary-domain.html }

      ReplyDelete
    4. Ok dah jumpa, info yang nak di cari.tq ya..

      ReplyDelete
    5. tapi komen sndiri still kuar agi...kekekekke >.<

      ReplyDelete
      Replies
      1. Cari line ni:
        var excludeUsers = ["Anonymous", "someotherusertoexclude"]; // jangan masukkan username ini

        Tukar kpd:
        var excludeUsers = ["Anonymous", "AiSyA LiEzA"]; // jangan masukkan username ini

        Lepas tu tengok.. keluar ke tak komen AiSyA LiEzA (^_^)

        Delete
      2. owh..macam ni ke...termakasih...blog sy ada masaalah Feed url...macamna nak buat ye..sbb tu saya kat sini tapi masih x de papepun...

        Delete
      3. tak mengapa, kod ini akam ambil default feed url

        Delete
    6. Best dan sesuai sgt ciri2 blog aku..terima kasih..:)

      ReplyDelete
    7. DH TRY...mg best w.pon ade jugak name sndri...ehe

      ReplyDelete
      Replies
      1. Nak buang komen sendiri cari line ni:
        var excludeUsers = ["Anonymous", "someotherusertoexclude"]; // jangan masukkan username ini

        Tukar kpd:
        var excludeUsers = ["Anonymous", "Harith Iskandar"]; // jangan masukkan username ini

        Dengan andaian "Harith Iskandar" adalah blog author (^_^)

        Delete
    8. Tak keluar pown en. Waazin... huhu

      ReplyDelete
    9. jadidah2... td tercopy sekerat. patutler... hehe terima kasih...

      ReplyDelete
    10. dah ikut semua step,tetap keluar komen sendiri..:(

      ReplyDelete
      Replies
      1. Nak buang komen sendiri cari line ni:
        var excludeUsers = ["Anonymous", "someotherusertoexclude"]; // jangan masukkan username ini

        Tukar kpd:
        var excludeUsers = ["Anonymous", "❤Kamsiah❤"]; // jangan masukkan username ini

        Dengan andaian "❤Kamsiah❤" adalah blog author (^_^)

        Delete
      2. perkataan ni pun kena ada skali ke?? // jangan masukkan username ini

        Delete
      3. sy punye tak jd la. maybe sbb nama ada simbol, mcm ni, ©AkuSeorangTraveler

        Delete
    11. Terima kasih saya kira satu Tutorial Widget Komen yang paling menarik. Saya telah menggunakanya terima kasih. Jom Singgah, "Citra Nukilan Sekadar Perkongsian">> " AKU ANAK PAHANG "

      ReplyDelete
      Replies
      1. Sama-sama.. insyaAllah saya akan ziarah..

        Delete
    12. dulu ada pasang top komentar pastu ilang tetiba, bila pasang yang ini ok..anyway ada tak cara nak scroll box?

      ReplyDelete
      Replies
      1. cara nak scroll box tambahkan kod seperti dibawah:

        <div style="width: 100%; height:270px; overflow-y:scroll; overflow-x:hidden;>

        ...html top comentator..
        ...html top comentator..

        </div>

        ubah 270px ketinggian ikut kesesuaian

        Delete
    13. Dah cuba mmg cantik lg menarik tp sy guna ruang komen g+. Tak link le. Boleh tunjuk ajar camana nk linkkan widget ni dgn komen g+ ya? Tk

      ReplyDelete
      Replies
      1. widget ini untuk rekodkan komen dalam sistem blogger blog sahaja. Jika guna komen g+ dalam blog, mmg tak boleh, sbb komen google+ dan blogger disimpan dalam server masing-masing. setakat ni saya belum jumpa untuk rekodkan komen terbanyak google+ untuk blogger blog.

        Delete
      2. Hari tu dah install tak tau camne boleh hilang. Ni nak install balik. Thanks abang Waazin

        Delete
    14. Terimakasih banyak Pak Waazin Aiman atas tutorial yang anda sajikan diatas. Saya sudah mencobanya dan alhamdulillah sudah berhasil :)

      Salam dari Indonesia :)

      ReplyDelete
    15. Sama-sama. Salam juga dari Malaysia.. ^_^

      ReplyDelete
    16. untuk papar pengoment bulanan macam mana?boleh x?

      ReplyDelete
    17. InsyaAllah boleh, tapi banyak kerjanya, kena ubah setting kod, pada baris ini:
      var numDays = 0; // komen sejak bila (ex. 30), atau 0 sejak dari mula contohnya:

      pada 1hb: var numDays = 1;
      pada 2hb: var numDays = 2;
      .
      .
      .
      pada 30hb: var numDays = 30;
      -tapi boleh juga ubah no tu selang 2, 3 atau 4 hari, mengikut kelapangan. atau pun pada setiap 30hb atau 31hb baru ubah no. boleh juga.

      ReplyDelete
    18. Assalamualaikum ... Nape tak kuar ape2 eak Just title n terus "Dapatkan Widget Ini" ...

      ReplyDelete
      Replies
      1. waalaikummusalam... cuba check semula kod yang Hani copy tu.. mungkin ada yg tertinggal.. apa link blog?

        Delete
      2. http://hanifadhlinaabdulrahman.blogspot.com

        TQ

        Delete
      3. http://hanifadhlinaabdulrahman.blogspot.com

        TQ

        Delete
      4. http://hanifadhlinaabdulrahman.blogspot.com

        TQ

        Delete
    19. hanifadhlinaabdulrahman.blogspot.com
      Tq.....

      ReplyDelete
    20. Masih keluar lagi la nama saya :'( Dah tukar kepada Cik Fyda dah. Kenape erk ?

      ReplyDelete
      Replies
      1. var excludeUsers = ["Anonymous", "Cik Fyda"]; // jangan masukkan username ini, tukar NickNameAdminBlog kpd nickname anda.
        ------------------------------------------------------------
        1. Pastikan jgn tertinggal tanda " dalam nick name. dan tanda2 lain spt ] dan ;
        2. semak semula HTML kod, mungkin ada yang tertinggal.

        Delete
    21. Assalamu'alaikum Wa'azin... ^^,

      Kak Ummi baru jumpa widget ni thanks to you dear, Kak Ummi dah 'copypaste'kan code di atas ke layaout, tapi dia tak keluar, harap Wa'azin tolong tunjukkan cara-caranya ya... ^^,

      ReplyDelete
      Replies
      1. Waalaikummusalam wbt. pasang dulu widget tu dulu.. nanti saya check. bagi link blog akak.

        Delete
      2. Assalammualaikum..nk cuba jugak..terima kasih kongsi.

        http://erynix.blogspot.com

        Delete
    22. Salam, terima kasih banyak2... dah copy paste yer. Cuma saya tak tahu nak buat scroll

      p/s saya dah follow blog ini.

      ReplyDelete
      Replies
      1. Waalaikummusalam. Terimakasih..
        cara nak scroll box tambahkan kod seperti dibawah:

        <div style="width: 100%; height:270px; overflow-y:scroll; overflow-x:hidden;>

        ...html top comentator..
        ...html top comentator..

        </div>
        ubah 270px ketinggian ikut kesesuaian

        Delete
    23. Saya guna widget ini. Tq banyak2. Cuma, ada cara tak kalau tak nak letak avatar blogger, nak nama je keluar..

      ReplyDelete
      Replies
      1. cuba ubah ni..
        var sizeAvatar = 40; ---> var sizeAvatar = 0;
        var cropAvatar = true; ---> var cropAvatar = false;

        Delete
      2. ok..kejap lagi saya edit. Tima kasih ye.. :)

        Delete
    24. Salam..dah buat tadi.. yg cara jadikan 40 ke 0 dengan tukar true kepada false di atas tadi tak berkesan.. Kemudian saya cuba buang perkataan [image] seperti yang ada dalam code di bawah ni..dan berjaya akhirnya... terima kasih ye.. :)

      [ * / var max TopCommenters=10;var minComments = 1;var numDays=30;var excludeMe=true;var excludeUsers=[" Anonymous","ctfand"];var maxUserNameLength=42; var txtTopLine= "< b >[ #].< / b > [image] [user] ([count]) ";var txtNoTopCommenters= " No top commentators at this time."

      ReplyDelete
    25. Jadi ler...terima kasih banyk2...tapi nak buat untuk komentar setiap bulan...mcmna cara dia..

      ReplyDelete
      Replies
      1. Sama-sama..
        InsyaAllah boleh, tapi banyak kerjanya, kena ubah setting kod, pada baris ini:
        var numDays = 0; // komen sejak bila (ex. 30), atau 0 sejak dari mula contohnya:

        pada 1hb: var numDays = 1;
        pada 2hb: var numDays = 2;
        .
        .
        .
        pada 30hb: var numDays = 30;

        -tapi boleh juga ubah no tu selang 2, 3 atau 4 hari, mengikut kelapangan. atau pun pada setiap 30hb atau 31hb baru ubah no. boleh juga.

        Delete
    26. Hi, is this widget works for comments using google+?

      ReplyDelete
    27. Tutorialnya baik sekali. Salam Ramadhan ya..:)

      ReplyDelete
    28. terima kasih kerana berkongsikan wiget yang terbaik ini.

      ReplyDelete
    29. wah mcm best, boleh letak nanti.

      saya dah follow sini #372. jemput ke blog sy ya

      www.norazua10.blogspot.com

      ReplyDelete
    30. pssttt...singgah sini..curi widget

      ReplyDelete
    31. Kalau nak exclude kan lebih daripada 1 username, macamana plak yer?
      Tqvm ;)

      ReplyDelete
      Replies
      1. cuba asingkan username dengan tanda koma..
        var excludeUsers = ["Username1", "Username2"];

        Delete
    32. +Razi ten nope.. works only on blogger comments.

      ReplyDelete
    33. Asalam..alhamdulillah Etuza berjaya mendapatkan semula widget top komentar ini..ini lah yag Etuza cari..ekoran tamplate lama etuza tukarkan,,dah berkali2 cuba tak berjaya tapi kali ini syukran dapat di blog saudari..tqvm

      ReplyDelete
      Replies
      1. Waalaikummusalam.. Alhamdulillah, syukran..

        Delete
    34. tengok ramai org pakai widget ni... teringin jugak nak letak kat blog.. tengkiu for sharing =)

      ReplyDelete
    35. yay!!! tq...dh berjaya buat....

      ReplyDelete
    36. saya tak jadi la. maybe ada simbol copyright tu kot.. huhu

      ReplyDelete
    37. Asalam sahabat ku saudaraku Wazin..Etuza datang membaca dalam rest ni. Terkejut rupanya blog Etuza ada dalam entri ni..hari tu tak klik..terima kasih ya....dalam bloglist..Etuza dah jadikan blog ni blog kegemaran utama

      ReplyDelete
    38. Waalaikumusalam sahabatku Etuza.. Terima kasih ye..

      ReplyDelete
    39. Assalamualaikum, alhamdulillah berjaya guna widget ni, tapi nak tanya la..macam nak dapatkan top komen untuk bulan yng dah lepas macam ogos, september...boleh ke?

      ReplyDelete
    40. Asalam..saya guna balik ni ruang komen ..tq

      ReplyDelete
    41. Nak letak top komentor bulan..dah ubah kod..
      masih juga tak menjadi

      ReplyDelete

    Post Top Ad

    Post Bottom Ad