Advanced URL Slug Generator With jQuery - stringToSlug

stringToSlug is an advanced and highly customizable slug generator to create SEO-friendly and human-readable slugs from any strings (typically article and post titles).

Requires the SpeakingURL library to remove special characters and convert the string to lowercase.

More Features:

• Divides words by a specific separator. Defaults to '-'.
• Supports prefix and suffix.
• Allows to replace any strings using Regex.
• Execute a function after a slug has been generated.

How to use it:

1. Load the required jQuery and SpeakingURL libraries from CDN.

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

2. Load the jQuery stringToSlug plugin right before the closing body tag.

<script src="dist/jquery.stringtoslug.min.js"></script>

3. Create an input field to accpet the article and post title.

<input type="text" class="example" />

4. Create an element named permalink to hold the generated URL slug.

<input type="text" id="permalink" disabled="disabled" />
<!-- Or Any Other Element -->
<p id="permalink"></p>

5. Attach the function stringToSlug to the input field and done.

$(function(){
  $(".example").stringToSlug();
});

6. Override the default selector of the output field.

$(".example").stringToSlug({
  getPut: '#permalink'
});

7. Customize the events to trigger the conversion.

$(".example").stringToSlug({
  setEvents: 'keyup keydown blur'
});

8. Customize the separator by which the plugin divide words in the slug.

$(".example").stringToSlug({
  space: '-'
});

9. Append suffix & prefix to the URL slug.

$(".example").stringToSlug({
  prefix: '',
  suffix: ''
});

10. Replace AND (&) character in the URL slug.

$(".example").stringToSlug({
  AND: 'and
});

11. You can also replace any useless and meaningless characters to generate clean URL slugs.

$(".example").stringToSlug({
  replace: '' // RegExp replacement: /\s?\([^\)]*\)/gi
});

12. Execute a callback function after the slug has been generated.

$(".example").stringToSlug({
  callback: function(text) {
    console.log('Callback: ' + text);
  }
});

13. Pass the SpeakingURL options to the plugin.

$(".example").stringToSlug({
  options: {
    // refers to https://pid.github.io/speakingurl/
  },
});

---

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