A slug is a way to represent a title with a limited charset (only lowercase letter and dash) to be inserted in the url. Even if it is a common function there is no good enough implentation when you Google for it.
Here are the features I needed:
- No multiple dashes.
----is converted to- - No wrapping dashes.
-title-is converted totitle - Basic support for internationalization.
Coût d'éclatis converted tocout-d-eclatDon’t look at the spelling mistake! - Basic support for common signs.
13$ & 12€is converted to13-dollar-and-12-euro
Demo
You can try the demo and see if it fits your needs.
var keys = keys || function (o) { var a = []; for (var k in o) a.push(k); return a; };
slug = function (string) {
// var accents = “àáäâèéëêìíïîòóöôùúüûñç”;
var accents = “u00e0u00e1u00e4u00e2u00e8”
+ “u00e9u00ebu00eau00ecu00edu00ef”
+ “u00eeu00f2u00f3u00f6u00f4u00f9”
+ “u00fau00fcu00fbu00f1u00e7”;
var without = “aaaaeeeeiiiioooouuuunc”;
var map = {‘@’: ‘ at ‘, ‘u20ac’: ‘ euro ‘,
‘$’: ‘ dollar ‘, ‘u00a5’: ‘ yen ‘,
‘u0026’: ‘ and ‘, ‘u00e6’: ‘ae’, ‘u0153’: ‘oe’};
return string
// Handle uppercase characters
.toLowerCase()
// Handle accentuated characters
.replace(
new RegExp(‘[‘ + accents + ‘]’, ‘g’),
function (c) { return without.charAt(accents.indexOf(c)); })
// Handle special characters
.replace(
new RegExp(‘[‘ + keys(map).join(”) + ‘]’, ‘g’),
function (c) { return map[c]; })
// Dash special characters
.replace(/[^a-z0-9]/g, ‘-‘)
// Compress multiple dash
.replace(/-+/g, ‘-‘)
// Trim dashes
.replace(/^-|-$/g, ”);
};
Code
var keys = keys || function (o) { var a = []; for (var k in o) a.push(k); return a; }; var slug = function (string) { // var accents = "àáäâèéëêìíïîòóöôùúüûñç"; var accents = "u00e0u00e1u00e4u00e2u00e8" + "u00e9u00ebu00eau00ecu00edu00ef" + "u00eeu00f2u00f3u00f6u00f4u00f9" + "u00fau00fcu00fbu00f1u00e7"; var without = "aaaaeeeeiiiioooouuuunc"; var map = {'@': ' at ', 'u20ac': ' euro ', '$': ' dollar ', 'u00a5': ' yen ', 'u0026': ' and ', 'u00e6': 'ae', 'u0153': 'oe'}; return string // Handle uppercase characters .toLowerCase() // Handle accentuated characters .replace( new RegExp('[' + accents + ']', 'g'), function (c) { return without.charAt(accents.indexOf(c)); }) // Handle special characters .replace( new RegExp('[' + keys(map).join('') + ']', 'g'), function (c) { return map[c]; }) // Dash special characters .replace(/[^a-z0-9]/g, '-') // Compress multiple dash .replace(/-+/g, '-') // Trim dashes .replace(/^-|-$/g, ''); }; |
var slug = function (string) {
// var accents = "àáäâèéëêìíïîòóöôùúüûñç";
var accents = "u00e0u00e1u00e4u00e2u00e8"
+ "u00e9u00ebu00eau00ecu00edu00ef"
+ "u00eeu00f2u00f3u00f6u00f4u00f9"
+ "u00fau00fcu00fbu00f1u00e7";
var without = "aaaaeeeeiiiioooouuuunc";
var map = {‘@’: ‘ at ‘, ‘u20ac’: ‘ euro ‘,
‘$’: ‘ dollar ‘, ‘u00a5’: ‘ yen ‘,
‘u0026’: ‘ and ‘, ‘u00e6’: ‘ae’, ‘u0153’: ‘oe’};
return string
// Handle uppercase characters
.toLowerCase()
// Handle accentuated characters
.replace(
new RegExp(‘[‘ + accents + ‘]’, ‘g’),
function (c) { return without.charAt(accents.indexOf(c)); })
// Handle special characters
.replace(
new RegExp(‘[‘ + keys(map).join(”) + ‘]’, ‘g’),
function (c) { return map[c]; })
// Dash special characters
.replace(/[^a-z0-9]/g, ‘-‘)
// Compress multiple dash
.replace(/-+/g, ‘-‘)
// Trim dashes
.replace(/^-|-$/g, ”);
};
Bonus
If you are bored, here is a little exercise for you. Can you find a and b such as
a >= b && a < = b // true a == b // false |
a == b
// false