Filter otomatis kata - kata kotor dalam komentar

Javascript jQuery

Adakalanya sebuah komentar yang masuk dalam blog anda memiliki kata - kata yang tidak pantas untuk di cantumkan dalam komentar dan ini mengganggu pengunjung lain yang berkomentar. umumnya tidakan berkomentar rendahan seperti ini dilakukan oleh orang yang tidak bertanggung jawab dan tidak memiliki etika yang baik yang tidak berani menampakkan diri sehingga bertindak bodoh dibalik nama anonim/anonymous. untuk mencegah hal ini, saya akan berbagi triknya dan silahkan simak berikut ini:

Pertama kita harus membuat sebuah script golongan kata - kata apa saja yang ingin kita kategorikan sebagai kata - kata yang tidak layak untuk di tampilkan dan harus di bersihkan. kemudian tentukan class/id element yang akan dipilih oleh selector untuk menerapkan tindakan ini, Contoh:

var comt = document.getElementsByClassName('comment-content');

var comt adalah merupakan pengelompokan/nama saja sebagai ciri untuk tindakan komentar, dan document.getElementsByClassName('comnment-contet'); adalah pengambilan class untuk menjalankan tindakan, class element bisa di lihat pada comment-content. ini adalah penamaan dan class tujuan yang akan di pilih. Selanjutnya buat sebuah perintah penerapan dalam sebuah element seperti berikut:

for(var i=0;i<comt.length;i++){
    comt[i].innerHTML = comt[i].innerHTML.replace(/kata-kata-kotor-pilihan-anda/gi, "saya-ganti-dengan-ini");
}   

for(var i=0;i<comt.length;i++) adalah dilakukan untuk perintah yang di beri nama comt, sedangkan comt[i].innerHTML = comt[i].innerHTML.replace(/kata-kata-kotor-pilihan-anda/gi, "saya-ganti-dengan-ini"); adalah jika di temukan di dalam penamaan comt maka perintahnya untuk mengganti dengan yang di tentukan.

Maka ketika script hasil dari semuanya telah selesai akan menjadi seperti berikut:

var comt = document.getElementsByClassName('comment-content');
  for(var i=0;i<comt.length;i++){
       comt[i].innerHTML = comt[i].innerHTML.replace(/kata-kata-kotor-pilihan-anda/gi, "kata-kata-pengganti");
}   

Script di atas sudah bisa digunakan, tinggal letakkan di template anda.

Jika anda memasang recent comment pada widget anda, sebaiknya buat juga script yang sama dengan nama variabel yang berbeda, agar kata - kata kotor dalam komentar anda juga tidak muncul dalam recent comment widget anda, Contoh seperti berikt.

var widg = document.getElementsByClassName('widget-content');
  for(var i=0;i<widg.length;i++){
       widg[i].innerHTML = widg[i].innerHTML.replace(/kata-kata-kotor-pilihan-anda/gi, "pengganti-kata-kotor");
}

Masih sama dengan trik diatasnya untuk komentar, sedangkan untuk widget saya hanya mengganti penamaan variabel var comt menjadi var widg dan class comment-content menjadi widget-content. jadikan satu/bungkus dua script di atas dalam satu kelompok seperti berikut:

<script type='text/javascript'>
//<![CDATA[
var comt = document.getElementsByClassName('comment-content');
  for(var i=0;i<comt.length;i++){
                        comt[i].innerHTML = comt[i].innerHTML.replace(/kata-kata-kotor-pilihan-anda/gi, "kata-kata-pengganti");
}   
var widg = document.getElementsByClassName('widget-content');
  for(var i=0;i<widg.length;i++){
                        widg[i].innerHTML = widg[i].innerHTML.replace(/kata-kata-kotor-pilihan-anda/gi, "pengganti-kata-kotor");
}
//]]>
</script>

Letakkan di atas kode tag </body> dan simpan.

Tambahan, jika kata - kata yang ingin anda filter di dalam komentar lebih dari satu, tambahkan saja comt[i].innerHTML = comt[i].innerHTML.replace(/kata-kata-kotor-pilihan-anda/gi, "kata-kata-pengganti"); kebaris berikutnya. lakukan hal yang sama untuk class widget.

untuk lebih mudahnya, saya sudah menyimpan script ini dalam satu paket yang bisa langsung anda gunakan tanpa susah. cukup copy kode dibawah ini:

<script type="text/javascript" src='http://template-defandaky.googlecode.com/files/filter-komentar.js'></script>

Letakkan tepat di atas kode tag </body> dalam HTML template anda dan simpan. tes pada komentar anda dengan memasang kata yang telah di tentukan untuk di filter dan lihat hasilnya.

Semoga bermanfaat....

Artikel Terkait

  • Teknik dasar untuk lebih memahami apa itu jQuery
    Jika kita kembali sejenak untuk melihat di situs resmi jQuery pada bagian documentasi ( http://docs.jquery.com/ ) maka akan ada aebelas yang harus kita pelajari untuk lebih memahami jQuery dan ini di sebut jQuery API ( Aplication Progamming Interface ). berikut ini sebelas hal tersebut: 1. jQuery    core 2.  Selec…
  • Membuat tombol spoiler di blogger
    Spoiler memiliki banyak kegunaan, selain untuk mengemas posting/konten yang terbilang panjang spoiler juga dapat di gunakan untuk meletakkan note/cuplikan khusus. Dengan Spoiler ini memiliki satu kelebihan penting, yaitu hanya menggunakan satu elemen tunggal. Elemen tombol pembuka/penutup spoiler tidak perlu kita sertakan di sini karena JQuery…
  • Seleksi otomatis tag blockquote dan pre
    Jika blog anda adalah sebuah blog yang terkadang menyuguhkan kutipan/baris tag kode untuk tutorial blogger maka trik ini sangat berguna untuk diterapkan. selain mempermudah pengunjung untuk menyalin kode tag anda berikan trik ini juga mempercepat pengunjung anda menyalin kode tag yang terkadang cukup panjang tanpa harus memblock semua kode sec…
  • Background berganti otomatis dengan jQuery
    Dekorasi website Anda dengan warna menarik selalu menjadi prioritas pertama dari seorang blogger. karena dengan tampilan yang enak di pandang dan rapi para pengunjung akan betah. Ini adalah alasan, mengapa orang selalu lebih memilih template dan tema Profesional untuk situs web mereka. tidak ada salahnya untuk menambahkan bebersapa modifikasi …
  • Spammer dan no live link
    Terkadang kita sering dipusingkan dengan banyaknya spmmer pada komentar, dengan menyimpan link aktif /hidup dan berbagai promosi yang tidak ada hubungannya dengan posting. Kebanyakan dari mereka komentarnya tidak bermutu, dan hanya mengharapkan backlink. Tentunya kita harus mengambil cara agar para spammer tidak seenaknya menyimpan tautan akti…
  • Pop-up kode menggunakan CSS3 dan jQuery
    Menambahkan jendela pop-up dengan cara yang sangat mudah menggunakan CSS3, Hal ini dapat digunakan untuk menampilkan kode sumber, gambar dan apa pun yang kita inginkan. Posting ini menjelaskan cara menambahkan jendela pop-up sederhana untuk blogger menggunakan CSS3 dan beberapa baris kode jQuery. Jendela Script Ini hanya tampilan sederhana…

8 komentar

  1. nice share gan, bermanfaat nih buat ada komentar yang tidak sopan atau spam :D

    BalasHapus
    Balasan
    1. sip gan :D

      kalau banyak yang mau di blok pkek yang ini <script type='text/javascript'>
      //<![CDATA[
      function blockNotAllowed(parentID,children){if(!document.getElementById(parentID))return;var parent=document.getElementById(parentID),content=parent.getElementsByTagName(children);for(var i=0;i<content.length;i++){var regex=/(^| |>)(OOT|oot|out of topic|visit back|diluar tema|diluar bahasan|o-o-t|kunbal|Oot)(<| |$)/g,html=content[i].innerHTML;content[i].innerHTML=(regex.test(html))?'<del>'+html.replace(regex,"$1<mark>$2</mark>$3")+'</del><br><br><cite class=\'attention\'>Kata-kata yang ditandai tidak boleh ada di dalam komentar</cite>': html;
      }
      }
      blockNotAllowed('comment_block', 'p');
      //]]>
      </script>


      Hapus
  2. Sangat bermanfaat untuk mengatasi komentar yang tidak bermanfaat untuk blog kita :)

    BalasHapus
  3. iya bener , boleh di praktekkan cara ini, untuk menghindari spam :D

    BalasHapus

Link aktif dalam komentar akan terhapus secara otomatis.
Untuk menyisipkan kode, gunakan tag <i rel="code">...KODE ANDA DI SINI...</i>
Untuk menyisipkan script, gunakan <i rel="pre">...KODE SCRIPT ANDA...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">...URL GAMBAR ANDA ...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">...JUDUL ANDA...</b>
Untuk menyisipkan catatan, gunakan tag <b rel="quote">...CATATAN ANDA...</b>
Untuk menciptakan efek tebal gunakan tag <b>...TEKS ANDA...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>...TEKS ANDA...</i>

Konversi KodeOOT
:) :( =( :wa: :s ^_^ :D =D ^:D @@, ;) :-bd :-d :ya: :'( T_T :\ :p B) :Q :Ozz 7:( \o/ **p
Jika anda memiliki bahasan atau topik lain yang sama sekali tidak ada hubungan dengan tutorial diatas anda bisa menyampaikannya di halaman OOt. klik [link ini] untuk membuka halaman OOT.

Back to Top
Loading...