Widget Recent Comment dengan Sistem Notifikasi

Tabel Konten
  1. Konfigurasi Widget Lanjutan 
  2. Opsi: interval 
  3. Opsi: alert 
  • Pembaharuan 
  • Pembaharuan 22 April 2013: Mengintegrasikan widget dengan cookies, menambahkan opsi summary dan menyingkirkan opsi tt_id.

    Recent Comments Widget for Blogger with Notification System

    Widget ini bukan widget recent comment biasa yang biasanya Anda temukan di blog-blog lain, karena widget ini memiliki kemampuan untuk memberitahu kepada administrator bahwa terdapat komentar baru yang telah masuk.

    Demonya bisa Anda lihat di sini, namun efeknya hanya akan terlihat apabila terdapat (paling tidak) satu komentar baru yang masuk di blog ini:

    Lihat Demo Unduh JavaScript

    Untuk memasang widget ini, pertama-tama tambahkan sebuah elemen halaman HTML/JavaScript. Salin kode ini kemudian letakkan di dalam formulirnya:

    <style scoped="scoped">
    .cm-outer {
      margin:0 auto;
      padding:0;
      font:normal normal 11px/normal Arial,Sans-Serif;
      border:1px solid;
      border-top:none;
    }
    .cm-outer li {
      margin:0;
      padding:7px 10px 12px;
      list-style:none;
      clear:both;
      border-top:1px solid;
    }
    .cm-outer .cm-header {margin:0 0 5px}
    .cm-outer .cm-content {overflow:hidden}
    .cm-outer img {
      display:block;
      float:left;
      margin:2px 10px 2px 0;
      border:4px solid black;
      background:#8fa2cb url('http://img1.blogblog.com/img/anon36.png') no-repeat 50% 50%;
      overflow:hidden;
    }
    </style>
    <div id="comments-container">Loading&hellip;</div>
    <script>
    var cm_config = {
        home_page: "http://nama_blog.blogspot.com",
        max_result: 7,
        t_w: 32,
        t_h: 32,
        summary: 9999,
        new_tab_link: true,
        ct_id: "comments-container",
        new_cm: " Komentar Baru!",
        interval: 30000,
        alert: true
    };
    </script>
    <script src="//dte-project.googlecode.com/svn/trunk/recent-comments-script-with-notification.js"></script>

    Ganti kode yang Saya beri tanda dengan URL blog Anda kemudian klik Simpan. Hasil maksimal akan terlihat saat terdapat komentar baru yang masuk.

    Konfigurasi Widget Lanjutan 

    Ada beberapa hal yang harus Anda ketahui mengenai konfigurasi lanjutan widget ini:

    OpsiKeterangan
    home_pageGanti nilainya dengan URL halaman muka blog Anda
    max_resultDigunakan untuk menentukan jumlah komentar yang akan ditampilkan pada widget ini
    t_wDigunakan untuk menentukan lebar avatar
    t_hDigunakan untuk menentukan tinggi avatar
    summaryDigunakan untuk menentukan jumlah karakter komentar yang ditampilkan
    new_tab_linkJika bernilai true, seluruh tautan yang ada di dalam widget ini akan terbuka di tab/jendela baru saat diklik
    tt_idID kontainer total komentar (abaikan jika tidak perlu)
    ct_idID kontainer daftar komentar (abaikan jika tidak perlu)
    new_cmLabel teks yang akan muncul setelah jumlah komentar (Misalnya: 2Komentar Baru!)
    intervalLihat deskripsi di bawah
    alertLihat deskripsi di bawah

    Opsi: interval 

    Digunakan untuk menentukan interval penyegaran feed komentar. Menggunakan satuan milidetik. Nilai 30000 artinya bahwa feed komentar akan disegarkan selama setengah menit sekali untuk memeriksa apakah terdapat komentar baru yang masuk atau tudak. Jika terdapat komentar baru yang masuk, maka widget ini akan menampilkan pesan bahwa komentar baru telah masuk.

    Opsi: alert 

    Ini cuma opsi untuk menentukan gaya pemberitahuan pesan. Jika bernilai false, widget ini akan menampilkan pesan masuknya komentar baru pada title bar peramban seperti gambar 1. Sebaliknya, jika bernilai true, notifikasi akan muncul pada kotak peringatan seperti terlihat pada gambar 2:

    Model Notifikasi 1
    Model Notifikasi 1: alert: false
    Model Notifikasi 2
    Model Notifikasi 2: alert: true

    Pembaharuan 

    Sekarang Anda bisa menampilkan teks notifikasi pada elemen HTML tertentu dengan cara mengubah nilai opsi alert menjadi sebuah fungsi seperti ini:

    var cm_config = {
        ...
        alert: function(total, label) {
            // Lakukan sesuatu dengan `total` dan `label`
        }
    };

    total berfungsi untuk menampilkan total komentar baru, sedangkan label berfungsi untuk menampilkan nilai pada opsi new_cm. Sebagai contoh, buat sebuah elemen HTML seperti ini. Elemen ini akan digunakan sebagai penampil/kontainer teks total komentar:

    <div id="show-total"></div>

    Setelah itu, sisipkan teks total komentar ke dalam elemen tersebut dengan JavaScript innerHTML melalui fungsi di atas:

    var cm_config = {
        ...
        alert: function(total, label) {
            document.getElementById('show-total').innerHTML = '<strong>'+total+' '+label+'</strong>';
        }
    };

    Jika terdapat notifikasi baru, maka teks notifikasi tersebut akan muncul di dalam elemen #show-total dan akan menghasilkan markup HTML seperti ini:

    <div id="show-total"><strong>1 Komentar Baru!</strong></div>

    Sebaiknya tambahkan juga atribut title dengan pesan tertentu dan satu buah fungsi kecil pada elemen di atas seperti ini:

    <div id="show-total" title="Abaikan!" onclick="this.innerHTML='';"></div>

    Fungsinya untuk menghilangkan teks total komentar apabila pengguna mengeklik elemen tersebut.

    173 Komentar

    • Misterie87

      Mas widgetnya kok kagak berfungsi ya? saya menggunakan custom domain dan dah cuba diblog saya. Tapi tak muncul pun isinya? ada apa2 setting yang perlu dilakukan sebelum menggunakan widget tersebut?

      • Taufik Nurrohman

        Set opsi Pengaturan Feed menjadi Penuh.

        • Misterie87

          Opsi Pengaturan Feednya udah jadi penuh. Tapi masih enggak mau muncul juga isinya. Napa ya mas? Coba mas lihat di blog ku. Hanya muncul word loading saja.

          • Taufik Nurrohman

            Sudah diperbaiki :) Ternyata penulis komentar Anonim di dalam JSON Blogger tidak memiliki properti uri. Ini yang menyebabkan widget menjadi error. Normalnya, sebuah array penulis di dalam JSON Blogger terdiri dari cabang-cabang ini:

            "author": [{
            "name": {
            "$t": "MRie RNie"
            },
            "uri": {
            "$t": "http://www.blogger.com/profile/01219820975711609271"
            },
            "email": {
            "$t": "noreply@blogger.com"
            },
            "gd$image": {
            "rel": "http://schemas.google.com/g/2005#thumbnail",
            "width": "32",
            "height": "32",
            "src": "//lh4.googleusercontent.com/-sRr-rd2Xxfw/AAAAAAAAAAI/AAAAAAAAARY/9lPBYFg7Tls/s512-c/photo.jpg"
            }
            }]

            Di dalamnya terdiri dari properti name, uri, email dan gd$image. Sedangkan dalam array penulis Anonim hanya terdiri dari properti name, email dan gd$image dengan avatar berupa http://img1.blogblog.com/img/blank.gif :W

            "author": [{
            "name": {
            "$t": "Anonymous"
            },
            "email": {
            "$t": "noreply@blogger.com"
            },
            "gd$image": {
            "rel": "http://schemas.google.com/g/2005#thumbnail",
            "width": "16",
            "height": "16",
            "src": "http://img1.blogblog.com/img/blank.gif"
            }
            }]

            Semoga bahasa Saya bisa mudah diterjemahkan ke dalam bahasa Malaysia :p

    • Unknown

      Apakah widget recent comments kayak gini bisa dibuat agar komentar dari admin ato pemilik blog tidak muncul??
      jadi yang muncul hanya komentar dari pembaca..
      bisa tidak mas??

      • Taufik Nurrohman

        Wah lupa. Saya tidak melengkapi widget ini dengan fitur itu. Tapi karena widget ini lebih memfokuskan kepada fitur notifikasinya, jadi Saya pikir komentar admin juga harus disertakan, supaya pengunjung yang sedang melihat-lihat isi posting sambil menunggu balasan dari admin juga bisa ikut mengetahui komentar-komentar baru yang masuk.

        • Unknown

          mas klo mau menambahkan fitur kyak gitu bagaimana bentuk penulisan jsonnya??
          saya mau coba menambahkannya pada widget ini :
          http://hompimpaalaihumgambreng.blogspot.com/2012/04/recent-post-dan-recent-comment-pada.html

          • Taufik Nurrohman

            Mungkin memakai filter nama penulis. Saya kurang tahu :p

            if ("MKR" in entry[i].author) { ... }
    • Beben Koben

      apaan c ini!!!

      • Beben Koben

        woh ternyata pemberitahuan komentar yah...ic ic ic.

    • Rosyd Aqbar

      ok, saya maksud sekarang, bisa di pake nih,
      tapi ini bukanya sistem notifikasi yang dipake seperti blog milik mas Tofik ?

    • seo

      thanks gan...langsung saya coba diblogspot saya

      salam kenal dari www.okenesia.com social bookmark

    • Anonim

      mas kok di blog saya semua commentya muncul, padahal max_result: nya udah saya ganti 5 :(
      mohon di lihat http://nevermore-404.blogspot.com/

      • Taufik Nurrohman

        Ups. Maaf, salah ketik di bagian ini:

        ?alt=json-in-script&redirect=false&max-result="+cm_config.max_result+"&callback=...

        Sudah diperbaiki. Seharusnya max-results, bukan max-result :p

        • Adi Nugraha Y

          itulah komputer, tidak memiliki toleransi walaupun kurang tulis 1 huruf saja.. -_-

    • Anonim

      masih ga bisa juga ya ? :(
      padahal udah saya ganti jadi max_results

      • Taufik Nurrohman

        Sudah Saya perbaiki lagi. Coba hapus semua kodenya lalu ulang lagi langkah-langkahnya.

        • Anonim

          dah bisa mas

    • Surga Kenari

      muncul notifikasinya ketika kita berada di homepage blog saja ya mas Taufik?

    • Anonim

      wah Informasi yang cukup bagus dan Gampang dicerna ..
      izin BERKUNJUNG
      #Salam Sehat Republik Blogger Nusantara

    • echo sd

      THX GAN....UDAH TAK COBA DI BLOG SAYA. APAKAH BISA DITAMBAHKAN FUNGSI SCRROL GAK GAN?????GIMANA CARANYA????TRIMS

      • Taufik Nurrohman

        .cm-outer {
        ...
        ...
        ...
        height:200px;
        overflow:auto;
        }
    • Anonim

      wah, ini dia yg ku cara2, terima kasih gan tutornya bermanfaat banget...

    • Unknown

      Kak taufik, kalau ada komentar trus di hapus oleh penulis setelah di terbitkan apakah notifasinya tetap akan muncul ?

      • Unknown

        Jadi error kak ?

        • Unknown

          Yang muncul cm loading gak selesai-selasai ?

      • Taufik Nurrohman

        Cara kerja widget ini sebenarnya cuma membandingkan antara jumlah komentar lama dengan komentar baru (feed komentar akan dimuat secara berkala dengan interval tertentu). Jika jumlah komentar yang baru saja dimuat lebih banyak dari jumlah komentar lama, maka akan muncul notifikasi bahwa komentar telah bertambah. Kalau masalah efek loading yang terjadi secara terus menerus Saya kurang tahu penyebabnya (secara, tidak ada efek loading pada widget ini). Kalau komentar yang sudah terbit kemudian dihapus oleh penulis paling cuma akan me-reset ulang perbandingan, jadi jumlah komentar lama akan berkurang satu. Selebihnya bisa dibayangkan sendiri.

    • IRIL SAGITA

      Kak, jika isi komentar di ganti dengan judul posting komentar tersebut gimana caranya kak ?

      • IRIL SAGITA

        Sudah ketemu caranya kak, makasih banget ?

    • IRIL SAGITA

      Kak aku terapkan di blog aku, hasilnya seperti ini :

      Codenya ini :

      <style type="text/css">
      #status-forum {
      text-align:left;
      padding:0;
      border:2px solid #000;
      font:normal normal 12px Arial,Sans-Serif;
      box-shadow:0 0 5px green,0 0 5px #000;
      -moz-box-shadow:0 0 5px green,0 0 5px #000;
      -webkit-box-shadow:0 0 5px green,0 0 5px #000;
      -khtml-box-shadow:0 0 5px green,0 0 5px #000;
      }
      #status-forum li {
      padding:5px 10px;
      background-color:#164407;
      border-bottom:1px solid #640505;
      position:relative;
      overflow:hidden;
      }
      #status-forum li:hover,
      #status-forum li:first-child {background-color:#133A06}
      #status-forum a {text-decoration:none}
      #status-forum a:hover {text-decoration:underline}
      .accessible-hidden {
      position:absolute;
      top:-99px;
      left:-99px;
      width:1px;
      height:1px;
      }
      </style>
      <div class='accessible-hidden' id='comments-status'></div>
      <div id='status-container'>Loading</div>
      <script src='https://sagitasoft.googlecode.com/svn/trunk/js/Status-notifikasi.js' type='text/javascript'></script>

      yang aku tanyakan kok alertnya gak berfungsi, dan jika ingin alertnya di tempatkan di lain tempat gimana,misal di atas kolom komentar ?

      Maaf, semenjak kejadian kemarin aku jadi hati-hati dalam bertanya ?

      • Taufik Nurrohman

        Saya coba secara offline jadi kok:

        Coba jangan memakai https

        <script src='http://sagitasoft.googlecode.com/svn/trunk/js/Status-notifikasi.js' type='text/javascript'></script>

        JavaScript sudah diperbaharui. Coba pelajari cara menampilkan notifikasi pada elemen HTML yang sudah Saya jelaskan di atas. Untuk memodifikasi widget versimu, cukup perbaharui saja pada bagian ini:

        if (oldCount < total) {
        if (cm_config.alert) {
        alert((total-oldCount)+cm_config.new_cm);
        } else {
        document.title = '('+(total-oldCount)+cm_config.new_cm+') '+document.title;
        }
        }

        ubah menjadi seperti ini:

        if (oldCount < total) {
        if (cm_config.alert === true) {
        alert((total-oldCount)+cm_config.new_cm);
        } else if (cm_config.alert === false) {
        document.title = '('+(total-oldCount)+cm_config.new_cm+') '+document.title;
        } else {
        cm_config.alert((total-oldCount),cm_config.new_cm);
        }
        }
        • IRIL SAGITA

          Ok, aku sudah berhasil kak, trus jika notifikasi ini di tampilkan bukan hanya untuk administrator atau semua pengunjung bisa melihatnya yang di ubah bagian mana kak ?

    • daun1

      jos

    • Unknown

      Mas mau nanya nih..
      bagaimana cara mendapatkan judul artikel yang di komentari??
      dan bagaimana bentuk pemanggilan JSON lengkapnya (untuk bagian judul saja)??
      seperti pada halaman notifikasi komentar mas Taufik..

    • Unknown

      mantapp..izin masang gan :D

    • Unknown

      Mantab izin pake di blog saya kang....

    • Unknown

      mantab...pembaruan dan pencerahan buat saya mas. makasih. salam blogger dan mahesa

    • Unknown

      kalau kita meletakkan widgetnya pada statis page atau halaman posting, notifikasinya tetap muncul atau tidak??

      • Taufik Nurrohman

        Muncul cuma di halaman posting/statis itu saja.

        • Unknown

          waduh... apa notifikasinya ga bisa dialihkan kesemua page.. ? seperti punya mas ini.. :D

    • Anonim

      kenapa yah , setiap saya memasang widget ini selalu muncul angka 78 atau 87 di blog saya , ~x(
      sudah saya buktikan memang masalahnya pada widget ini , :\

    • EM

      assalamu'alaikum,
      untuk mengatur jumlah karakter pada recent commentnya gimana mas?

    • Unknown

      Trims kk atas infonya

    • Anonim

      Lapor, Mas Taufik..
      hari ini tiba2 potongan komentar dari pengunjungnya gak muncul. Kenapa ya?
      http://muxlimo.blogspot.com/p/blog-page_28.html#axzz2RwSTFXXT

      • Taufik Nurrohman

        Sekarang komentarnya sudah keluar.
        Oya, pada bagian konfigurasi URL, kalau bisa jangan diberi akhiran /

        // Bukan
        home_page: "http://nama_blog.blogspot.com/";
        // Tapi
        home_page: "http://nama_blog.blogspot.com";
    • Unknown

      wah, Blogger baru aja memakai fitur ini tp mas lebih dulu, salut! :-bd

    • Anonim

      Izin pasang di Blog saya , dan salam kenal ....

    • Gogobel

      Keren. Kalau menghubungkan ke halamannya gimana gan? Seperti yang di blognya mas Taufik ini. Kan kalau di klik terhubung ke halaman /p/notifikasi.html. Maaf, ane newbie gan.. Tapi Blogger sendiri kok belum kepikiran yang kyk gini ya???

      www.lapseg.com

    • Fernando Salas

      Wow exelent

    • Unknown

      Gan kok ngga Keluar yaa Seperti agan
      alert pemberitahuan commentar
      Jadi cuman gini aja

      var cm_config = {
      home_page: "http://nama_blog.blogspot.com",
      max_result: 7,
      t_w: 32,
      t_h: 32,
      summary: 9999,
      new_tab_link: true,
      ct_id: "comments-container",
      new_cm: " Komentar Baru!",
      interval: 30000,
      alert: true
      };

      dan saya pengen seperti agan
      seperti di gambar nie
      saya sdah beri tanda merah di gambar nyaa

      Mohon bantuan nyaa saya buat di Blog Cinema saya gan :)
      http://twinsxtv.blogspot.com/

    • Unknown

      dan ini gan buat apa ?
      var cm_config = {
      ...
      alert: function(total, label) {
      document.getElementById('show-total').innerHTML = '<strong>'+total+' '+label+'</strong>';
      }
      };

      Kalau disatukan dengan Script awal agan yang di atas gmn ?

      • Taufik Nurrohman

        Buat elemen #show-total menjadi posisi fixed lalu beri warna merah. Kira-kira seperti ini:

        #show-total {
        position:fixed;
        top:10px;
        left:10px;
        z-index:9999;
        background-color:#CB1517;
        color:white;
        padding:2px 4px;
        }

        Lalu untuk penggabungannya…

          ...
        <div id="show-total"></div>
        </body>
        var cm_config = {
        home_page: "http://twinsxtv.blogspot.com",
        max_result: 7,
        t_w: 32,
        t_h: 32,
        summary: 9999,
        new_tab_link: true,
        ct_id: "comments-container",
        new_cm: " Komentar Baru!",
        interval: 30000,
        alert: function(total, label) {
        document.getElementById('show-total').innerHTML = total + ' ' + label;
        }
        };
        • Unknown

          Nah kalo agan kan bisa tuh langsung balas tanpa musti ke post langsung seperti
          Kotak merah besar yang saya beri tanda tuh ?
          bagaimana tuh gan ...

    • Imron Fhatoni

      Komentar ini telah dihapus oleh pengarang.

      • Taufik Nurrohman

        Saya cuma bisa membantu memandu cara membuat notifikasinya saja, tapi bukan panel notifikasi dan tombol balas beserta hapusnya. Tidak mungkin bisa dijelaskan di area komentar (sekalian sebagai komentar balasan untuk @TWINSX VEIVO [ADMIN]).

        Untuk kasusmu, letakkan elemen #show-notifikasi di dekat #status-container misalnya seperti ini:

        <div id='status-container'>
        ...
        </div>
        <div id='show-notifikasi'></div>
        #show-notifikasi {
        position:fixed;
        top:10px;
        left:10px;
        z-index:9999;
        background-color:#CB1517;
        color:white;
        padding:2px 4px;
        }
        • Imron Fhatoni

          terima kasih banyak mas taufik :)

        • Unknown

          Hebat Lah dikau gan ..
          Love this Tutorial ...
          mantep banget ... Kalau bisa Keluarkan yang baru2 yahh ??
          aslii salut saya sama anda

        • budkalon

          Lalu, apakah logika dari sistem ini adalah.
          Saat tombol merah di klik, maka $('#sidebar').html(daftar_komen)
          Lalu isi dari variabel daftar_komen itu datanya diambil dari apa? Apakah feed?

          • Taufik Nurrohman

            Dari feed.

            • Unknown

              Maaf Kang Taufik
              kok ID nie

              
              <div id='status-container'>
              </div>
              

              Kok ngga bisa yaa ?
              itu guna nya apa kalau agan pakai ?
              untuk id status-container

              maaf jikalau ane banyak bertanya

              • Taufik Nurrohman

                Itu untuk kasusnya Imron Fhatoni. Punyamu tidak perlu mengikuti yang ini. Baca balasan dari Saya yang pertama saja.

    • Imron Fhatoni

      mas taufik satu lagi pertanyaan saya apakah pembritahuan notifikasi tidak bisa diarahkan kesuatu laman blog yang menampilkan jumlah komentarnya seperti pada from komentar mas,,?

      • Unknown

        Seperti gambar nie kan
        yang tanda merah besar

      • Taufik Nurrohman

        alert: function(total, label) {
        document.getElementById('show-total').innerHTML = '<a href="URL-HALAMAN.html">' + total + ' ' + label + '</a>';
        }
        • Unknown

          Youre the best i ever meet :)
          the one who Make Css by your ownself

          Thanks so much
          sangat2 terbantu untuk ini sob
          alhamdulilah .. terimakasih banyak kang taufik

        • Anonim

          saya coba bungkus dengan '<a href="URL-HALAMAN.html">' + total + ' ' + label + '</a>' notifikasinya bahkan ga muncul mas.. apa qira2 ya..

    • Unknown

      Thanks for all tutor nya gan!!
      sukses slalu buat css ..
      ditunggu CSS dan WIdget2 lain nya yang terbaru !

      Trimakasih Kang Taufik

    • Meme Indonesia

      mas, mau tanya. Kenapa notifikasi muncul setelah buka laman yang dituju? bukan di sembarang tempat. bagaimana kalau menampilkan notif setelah 30 detik di halaman sembarang pada blog.

      Misal disini, mesirr.blogspot.com . Kalau komen dan tidak muncul notif. Baru muncul notif setelah bukan halaman ini mesirr.blogspot.com/2013/10/komentar.html

    • you

      sudah saya ulangi beberapa kali v gagal trus..
      isi komtarnya ga muncul.. yang muncul cuma nama ttl, dan thumbnailnya saja.. mhon penerangannya

      • you

        check url = http://www.pabk-4you.com/#popup

      • Taufik Nurrohman

        Mungkin masalahnya dari pengaturan feed posting dan komentar. Coba ubah pengaturan feed komentar ke Penuh.

        • you

          benar mas sekarang sudah bisa..
          maaf mas mau tanya lagi kalo boleh.. mudah-mudahan ga bosen...
          skeleton += '<li>';
          skeleton += '<div class="cm-header"><strong><a href="' + link + '" title="' + title + '"' + nt + '>' + name + '</a>, ' + date + '</strong></div>';
          skeleton += '<div class="cm-content"><a href="' + profile + '" title="' + name + '"' + nt + '><img alt="Loading..." style="width:' + co.t_w + 'px;height:' + co.t_h + 'px;" src="' + avatar + '"></a>';
          skeleton += '<span class="cm-text">' + content + '</span>';
          skeleton += '</div></li>';
          }
          skeleton += '</ul>';

          kode diatas saya ganti jadi seperti ini :
          skeleton += '<li>';
          skeleton += '<div class="cm-header"><strong><a href="' + profile + '">' + name + '</a></strong> pada <a href="' + link + '" title="' + title + '"' + nt + '>' + title + '</a></div>';
          skeleton += '<div class="cm-content"><a href="' + profile + '" title="' + name + '"' + nt + '><img alt="Loading..." style="width:' + co.t_w + 'px;height:' + co.t_h + 'px;" src="' + avatar + '"></a>';
          skeleton += '<span class="cm-text">' + content + '</span>';
          skeleton += '<div class="cm-footer">' + date + ' <a href="" title="Balas komentar ini...">Balas</a> <a href="" title="Hapus komentar ini..." target="_blank">Hapus</a></span> </span>';
          skeleton += '</div></li>';
          }
          skeleton += '</ul>';

          dan berhasil.. cuma saya bingung untuk mengisi url balas dan hapus komentarnya.. kira2 kalo bisa seperti apa?

          • you

            satu lagi mas maaf. untuk memunculkan notifikasi seperti di gambar demo bagaimana? sudah saya coba berulangkali bahkan saya ganti sebagian dengan script seperti komen yang mas bales buat sagitasoft sudah saya lakukan v tetep saja ga muncul . mhon bantuannya

          • IRIL SAGITA

            Mungkin ini bisa membantu kak.....

            Pada baris ini :

            profile = (author.uri) ? author.uri.$t : "#nope",

            Coba tambahkan ini tepat dibawahnya :

            u = entry[i].id.$t.replace(/^.*?blog\-([0-9]+).*?post\-([0-9]+)/,"http://www.blogger.com/delete-comment.g?blogID=$1&postID=$2"),

            Kemudian di bagian ini :

            skeleton += '<li>';
            skeleton += '<div class="cm-header"><strong><a href="' + profile + '">' + name + '</a></strong> pada <a href="' + link + '" title="' + title + '"' + nt + '>' + title + '</a></div>';
            skeleton += '<div class="cm-content"><a href="' + profile + '" title="' + name + '"' + nt + '><img alt="Loading..." style="width:' + co.t_w + 'px;height:' + co.t_h + 'px;" src="' + avatar + '"></a>';
            skeleton += '<span class="cm-text">' + content + '</span>';
            skeleton += '<div class="cm-footer">' + date + ' <a href="" title="Balas komentar ini...">Balas</a> <a href="" title="Hapus komentar ini..." target="_blank">Hapus</a></span> </span>';
            skeleton += '</div></li>';

            Ganti dengan ini :

            skeleton += '<li>';
            skeleton += '<div class="cm-header"><strong><a href="' + profile + '">' + name + '</a></strong> pada <a href="' + link + '" title="' + title + '"' + nt + '>' + title + '</a></div>';
            skeleton += '<div class="cm-content"><a href="' + profile + '" title="' + name + '"' + nt + '><img alt="Loading..." style="width:' + co.t_w + 'px;height:' + co.t_h + 'px;" src="' + avatar + '"></a>';
            skeleton += '<span class="cm-text">' + content + '</span>';
            skeleton += '<div class="cm-footer">' + date + ' <a href="'+ link +'" title="Balas komentar ini...">Balas</a> <aa href="'+ u +'" title="Hapus komentar ini..." target="_blank">Hapus</a></span> </span>';
            skeleton += '</div></li>';
    • Anonim

      mas ini apanya yang salah ya?kok gak bisa
      alert: function(total, label) {
      document.getElementById('show-total').innerHTML = '<a class="baru" href="p/comment.html?notification='+total+'>'+total+' '+label+'</a>';

      • you

        coba gini z gan... kode diatas ganti z seperti semula.. coba yang dirubah <div id="show-total"></div>
        menjadi
        <a href='/p/comment.html' id='show-total'></a>

        • Anonim

          ane pengen di urlnya mucul angka notifnya gan
          jadi kaya gini /p/comment.html+total

    • Unknown

      Kang taufik ada yang baru lagi ngga nie ?

    • Unknown

      Jikalau ada beri tahu ane okeyy ?

    • Anonim

      gan kok punya ane nampilin total komen doang ?
      chek dimari http://nevermore-404.blogspot.com/p/test-page.html
      ane pake ini
      <a href="#" id="show-total"></a>
      <script type="text/javascript">
      var cm_config = {
      home_page: "http://nevermore-404.blogspot.com/",
      max_result: 7,
      t_w: 32,
      t_h: 32,
      summary: 9999,
      new_tab_link: true,
      ct_id: "comments-container",
      new_cm: " Komentar Baru!",
      interval: 30000,
      alert: function(total, label) {
      document.getElementById('show-total').innerHTML = '<strong>'+total+' '+label+'</strong>';
      document.getElementById('show-total').setAttribute('href', '/p/blog-page_25.html?notification='+total);
      }

      };
      </script>
      <script type="text/javascript" src="http://reader-download.googlecode.com/svn/trunk/recent-comments-script-with-notification.js"></script>

    • Unknown

      thanks

    • Kang Ismet

      kalau menggunakan kode

          alert: function(total, label) {
      document.getElementById('show-total').innerHTML = '<strong>'+total+' '+label+'</strong>';
      }

      apa yang di title bar jadi menghilang? apa bisa disatukan dengan alert: true, saya udah pasang dengan susah payah, akhirnya berhasil juga, tapi di titlr bar tidak muncul

      • Unknown

        .
        alert: function(total, label) {
        document.getElementById('show-total').innerHTML = '<strong>'+total+' '+label+'</strong>';
        document.title ='('+ total + ') ' +document.title;  // coba tambah bagian ini kang :)
        }
        • Kang Ismet

          bisa sob saya coba, pas masuk lagi 2 kali ko jadi aneh ya

          • Unknown

            kalau dirubah gini gimana kang..... ???

            document.title ='('+ total + ')' +document.title.substr(document.title.lastIndexOf(")") + 1)

            kalau gak bisa juga... kita sama2 nunggu saran dr mas taufik aja.... :D

            • Taufik Nurrohman

              var originalTitle = document.title;
              // ...
              var cm_config = {
              alert: function(total, label) {
              document.title = '(' + total + ') ' + originalTitle;
              }
              };
              • Kang Ismet

                mantep mas.. supaya hilang pas di klik pada title bar, bisa tambah class? atau ada cara lain?

                • Taufik Nurrohman

                  document.getElementById('sample-button').onclick = function() {
                  document.title = originalTitle;
                  };
    • Kang Ismet

      maaf di atas udah habis spacenya, kalau 2 id memiliki fungsi sama, perintahnya bisa disatukan? cntoh
      document.getElementById('sample-button').onclick = function() {
      document.title = originalTitle;
      };
      document.getElementById('notif-button').onclick = function() {
      document.title = originalTitle;
      };

      • Taufik Nurrohman

        Begini pak:

        function clearNotifOnClick(elem) {
        document.getElementById(elem).onclick = function() {
        document.title = originalTitle;
        };
        }
        clearNotifOnClick('sample-button');
        clearNotifOnClick('notif-button');
        • Kang Ismet

          mantap sob.. emang jagonya nih :-d

        • Kang Ismet

          masih ada pertanyaan lagi nih.. sorry ya sob.. nanya mulu, kalau menerapkan manipulasi pada summary, sehingga tag pre, img quote tetep muncul, gimana editingnya?

          • Taufik Nurrohman

            Tidak bisa kalau memakai mode summary, harus memakai yang default. Lalu hapus fungsi .replace(...).replace(...) sebelum xxx[i].content.$t

            • Kang Ismet

              udah bisa sob.. tks

            • Anonim

              punya saya kok pas refresh emonya gak muncul lagi ya mas :(
              cek di mari http://nevermore-404.blogspot.com/p/ass.html

              • Taufik Nurrohman

                Seperti yang Saya katakan ke Rizky Kurniawan Ritonga, fungsi manipulasi harus dieksekusi ulang setiap kali item komentar termuat lagi. Sayangnya pas Saya cek ternyata kamu memakai emotikon versi JQuery yang pernah Saya buat. Kalau kamu memakai emotikon versi Saya yang ini kamu bisa mengeksekusi fungsi manipulasi kembali dengan mudah untuk keperluan ini:

                function commentManip() {
                repText('comments-container');
                }
    • bad

      nanya lagi mas,, notifikasi widget ini kan buat seluruh komentar dalam blog,,, misalnya cuma buat menampilkan notifikasi komentar dari sebuah halaman saja bisa nggak ya... di tunggu jawabannya..

    • Unknown

      Bisa gak, nanti ada gambar, disampingnya ada angka komentar baru, seperti mkr site atau blognya kang ismet , lalu jika diteken gambarnya, muncul recent comment, bisa gak ? :)

    • Imron Fhatoni

      Mas Taufik mau nanya kalau semisal notifikasinya seperti pada dte sebelumnya misalnya notifikasinya muncul kemudian setelah di klik redirect ke halaman lain contohnya LAMAN notifikasinya bisa dibantu ngak mas taufik..?

    • asdas

      :-bd kunjungi ya http://daffa-nur.blogspot.com/
      masih dalam perbaikan

    • Yandi Mulyadi

      Mas, bisa gak ya Recent Comment saya " www.mafiasitez.blogspot.com " mempunyai sistem notifikasi , coba deh liat :(

      • Yandi Mulyadi

        Mas Taufik, cara menambahkan tombol balas dan Hapus pada notifikasi ini gimana? :(

        • Taufik Nurrohman

          Tanya sama Kang Ismet...

          • Yandi Mulyadi

            Mas saya mau nanya, kan sususan cm-total saya seperti ini :

            #cm-total {
            position:fixed;
            top:5px;
            right:46px;
            width:188px;
            text-align:left;
            z-index:9999;
            cursor:pointer;
            }
            .total-counter {
            background-color:#d11919;
            color:white;
            padding:2px 6px;z-index:99991;
            font-family:Arial,Sans-serif;
            font-size:11px;
            border-radius:5px;
            font-weight:bold;
            }

            Nah, saya pengen ubah notifikasi masuk (setiap ada komentar masuk) tetap di atas . maksudnya posisinya bukan fixed, tapi saya ubah positionnya ke relative atau absolute atau static atau inherit tetap malah gak muncul notif nya eh yang muncul kalo pas pake fixed, padahal saya pengen pas di scroll elemen itu tidak ikut kebawah . . mohon bantuannya di www.mafiasitez.blogspot.com :(

    • IRIL SAGITA

      Pagi kak, aku punya kendala dalam memodifikasi notifikasi versi cookie ini, yaitu jika visitor baru mengunjungi blog kita atau cookie peramban di reset maka di angka notifikasi yang tampil total angka semua jumlah komentar di blog saya kak, seperti ini screenshotnya :

      Nah, bagaimana cara itu terjadi kak, mohon penjelasannya ?

      • IRIL SAGITA

        Maaf salah ketik, bagaimana agar hal itu tidak terjadi kak ?

        Atau jika pertanyaanku kurang dimengerti bisa di cek di : SAGITA COM

      • Kang Ismet

        nunggu balesan juga.. :)

      • Taufik Nurrohman

        Saya mengatasinya dengan membatasi jumlah maksimal 50 komentar:

        var totalComments = total - oldCount > 50 ? '50+' : total - oldCount;
        if (oldCount < total) {
        if (co.alert === true) {
        alert(totalComments + co.new_cm);
        } else if (co.alert === false) {
        document.title = '(' + totalComments + co.new_cm + ') ' + doc_title;
        } else {
        co.alert(totalComments, co.new_cm);
        }
        }
        • Unknown

          Alhamdulillah... udah bisa saya terapkan..
          Tapi gimana ya supaya total komen 50+ itu tidak muncul di saat visitor pertama kalinya mengunjungi situs kita?
          -maksud saya, pemberitahuan tentang adanya komentar hanya akan muncul saat adanya komen yang baru.. bisa gak ya..

          • Taufik Nurrohman

            Untuk kasusmu mungkin lebih baik dikosongkan saja...

            var totalComments = total - oldCount > 50 ? '50+' : total - oldCount;
            if (oldCount < total && totalComments < 51) {
            if (co.alert === true) {
            alert(totalComments + co.new_cm);
            } else if (co.alert === false) {
            document.title = '(' + totalComments + co.new_cm + ') ' + doc_title;
            } else {
            co.alert(totalComments, co.new_cm);
            }
            }
    • Anonim

      coba dulu :)

    • Yandi Mulyadi

      mas mau nanya, coba cek ke www.mafiasitez.blogspot.com .. Kok letak emoticon di punya ku seperti itu ya mas . . tidak pas di content malah di gambar avatarnya (komentarnya) klik deh .. :'( bantu yah mas

    Komentar telah ditutup.