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

  • Memasang total post dan total comment
    Mungkin ini bukan trik baru, tapi saya coba terapakan kembali sedikit trik lama ini untuk menambah keunikan di dalam tampilan blog saya. memasang total post dan total comment bukan hal yang sulit, karena kita hanya perlu menggunakan sedikit script. script yang di gunakan seperti di bawah ini: Script untuk Total Posts <script style="text/j…
  • Membuat current page pada menu navigasi
    Current page atau Current menu adalah sebuah fungsi dimana di posisikan sebagai penanda halaman aktif pada menu navigasi yang sedang di buka atau di kunjungi, misalkan pada link menu navigasi Contact, maka link pada menu navigasi Contact yang akan di beri penanda berbeda dari link menu navigasi lainnya. biar sobat tidak bingung langsung saja l…
  • jQuery Show Hide Checkboxes
    Kali ini saya akan share Show Hide sederhana menggunakan jQuery Checkboxes value, prinsip kerjannya sama saja dengan jQuery show hide hanya saja berbeda di medianya. trik ini juga sebelumnya pernah saya gunakan untuk membuat show hide emoticon, konversi kode dan halaman OOT di komentar blog saya, jika mungkin anda juga berminat menggunakan jQu…
  • Menu Tab dengan jQuery
    Untuk menghemat tempat, tab view menu sangat efisien untuk solusinya karena Ukuran yang relatif kecil tapi bisa memuat space yang lumayan. kali ini saya akan membagikan cara membuat tab menu, silahkan simak jika anda sedang mencari cara membuatnya. Jika setelah jadi nanti lebar atau tinggi menu tab ini tidak sesuai, silahkan anda sesuaikan se…
  • Show hide related post (perbaharuan)
    Hallo para sobat blogger, masih semangat ngeblog kali ini saya mau share bagaimana cara dan trik membuat show hide pada related post di blog. triknya cukup mudah dan mungkin berguna untuk blog sobat agar tampil lebih ringkas dan beda dari yang lainnya... kira kira nanti hasilnya akan seperti berikut ini jika sobat ingin menerapkan trik s…
  • Background posting berbeda - beda di homepage
    buat sobat yang sedang mencari trik atau cara untuk membuat tampilan posting tampil dengan warna background yang berbeda beda di setiap lebel dan halaman depan blog saja dan suka dengan tampilan seperti ini bisa menggunakan trik mudah berikut ini. caranya pun juga cukup mudah, silahkan buka editor template blog sobat lalu cari kode </head&…

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...