Fast Profanity Filter Plugin For jQuery

File Size: 24.4 KB
Views Total: 750
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Fast Profanity Filter Plugin For jQuery

A client-side and multilingual profanity filter helps to create a more positive and welcoming atmosphere on your website.

This jQuery profanity filter plugin censors bad language on the webpage and replaces bad words (offensive words, swear or cuss words) with custom characters you specify. This can be helpful in creating a more family-friendly or professional environment on your website.

See Also:

How to use it:

1. Download and include the jQuery profanityFilter in your project.

<script src="/path/to/cdn/jquery.slim.min.js"></script>
<script src="/path/to/jquery.profanityfilter.min.js"></script>

2. Call the function on the target text container and load the preset swear words list.

$('#example').profanityFilter({
  externalSwears: 'swearWords.json',
})

3. This plugin currently supports 8 languages:

  • de.json
  • en.json
  • es.json
  • fr.json
  • it.json
  • nl.json
  • pt.json
  • ru.json
$('#example').profanityFilter({
  externalSwears: './localResources/de.json',
})

4. You can also define your own swearword list in a JS array as follows:

$('#example').profanityFilter({
  customSwears: ['ass', 'shit'],
})

5. By default the plugin will replace all bad words defined in the swearword list with an asterisk (*). You can use the replaceWith option to customize the characters used to replace bad words in the text.

$('#example').profanityFilter({
  replaceWith: ['jquery', 'script'],
})

6. Highlight all bad words in the text instead of filtering.

$('#example').profanityFilter({
  filter: false,
  profaneText: function (data) {
    data.forEach(function (element, index) {
      var str = '<span class="highlight">' + element + '</span>';
      $('#example').html($("#example").html().replace(element, str));
    });
  }
})
.highlight {
  color: red;
  text-decoration:underline;
  font-weight: bold;
  background-color:yellow;
  padding: .2em;
}

 


This awesome jQuery plugin is developed by ChaseFlorell. For more Advanced Usages, please check the demo page or visit the official website.