Multilang Slugify
Slugify is an all-purpose slug generator that converts text into clean, SEO-friendly slugs. It's ideal for automating anchor IDs in headings and is designed to handle a wide range of languages and special characters.
Demo
Supported Languages
Slugify supports a diverse set of languages:
German, Danish, Dutch, Finnish, French, Hungarian, Italian, Norwegian, Portuguese, Romanian, Russian, Spanish, Swedish, Turkish, Greek, Bulgarian, Serbian, Croatian, Czech, Polish, Slovak, Slovenian, Latvian, Lithuanian, Estonian, Persian, Arabic, Hebrew, Hindi, Thai, Chinese, Japanese, Korean, Vietnamese, and Ukrainian, as well as Emoji
Installation
You can install this module via npm:
$ npm i @danielhaim/slugify
NPM
import slugify from './path/to/slugify/index.js';
const slugify = new slugify();
console.log(slugify.generate("Hello World!"))
Examples
Headings with IDs
Input:
<h1><span>How will mobile commerce impact 2022?</span></h1>
<h2><span>Sophia, Ärztin aus Hamburg</span></h2>
<h2><span>Süße Sophia, schön und klug</span></h2>
function generateSlug(titleElement) {
const titleContent = titleElement.textContent || '';
const slugifier = new Slugify();
const slugged = slugifier.generate(titleContent);
return slugged;
}
const headingElements = document.querySelectorAll('h1, h2, h3, h4, h5, h6');
headingElements.forEach((headingElement) => {
const slugged = generateSlug(headingElement);
if (slugged) {
const anchorElement = document.createElement('a');
anchorElement.href = `#${slugged}`;
anchorElement.textContent = headingElement.textContent;
headingElement.innerHTML = '';
headingElement.appendChild(anchorElement);
}
});
Output:
<h1><a href="#how-will-mobile-commerce-impact-2022"><span>How will mobile commerce impact 2022?</span></a></h1>
<h2><a href="#sophia-aerztin-aus-hamburg"><span>Sophia, Ärztin aus Hamburg</span></a></h2>
<h2><a href="#suesse-sophia-schoen-und-klug"><span>Süße Sophia, schön und klug</span></a></h2>
German special characters
const slugifier = new Slugify();
slugifier.generate('Ist dein Name Sophia?');
slugifier.generate('Sophia, Ärztin aus Hamburg');
slugifier.generate('Wie geht es dir, Sophia?');
slugifier.generate('Süße Sophia, schön und klug');
slugifier.generate("Sophia's Geburtstag");
Additional examples with special characters and delimiters
const slugifier = new Slugify();
slugifier.generate('Hello, world!');
slugifier.generate('Hello, world!');
slugifier.generate('Hello, world!');
slugifier.generate('#1 Best in Class');
slugifier.generate('hello@example.com');
Build Process
$ npm run build
Test
$ npm run test
Report Bugs
If you encounter any bugs or issues while using the library, please report them by opening a new issue in the repository's issue tracker.
When reporting a bug, please provide as much detail as possible, including the steps to reproduce the issue and any error messages that you see. I appreciate any contribution to improving this library.