Criando um Slug a partir de uma String com JavaScript e Expressão Regular
Sem dúvida a geração de URLs Amigáveis (para os íntimos Slugs) pode se tornar uma árdua tarefa, justamente porque aqui no Brasil, onde temos uma língua de origem no latina, assim como outros países que possuem caracteres com acentos, letras diferentonas e algumas outras particularidades podemos facilmente estragar (literalmente) aquelas funções bonitas que vemos em desenvolvedores americanos-ingleses, etc…
Foi justamente por conta desse problema que precisei adaptar e dar um fork no GitHub neste código (que foi muito bem feito pelo Mathew) para tratar caracteres especiais.
E é exatamente com esta pequena função que eu tomei vergonha na cara e estreei (sim apenas no fim de 2017) no aclamado GitHub. Para quem quiser me seguir, meu user é gabrielfroes.
Fiz algumas adaptações, mas a principal foi a de tratar os caracteres especiais (incluindo aí as acentuações), mas também a de utilizar a função através do prototype String. Dessa forma temos uma função mais estilosa e mais prática.
Segue o código:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
/* Create SLUG from a string This function rewrite the string prototype and also replace latin and other special characters. Forked by Gabriel Fróes - https://gist.github.com/gabrielfroes Original Author: Mathew Byrne - https://gist.github.com/mathewbyrne/1280286 */ if (!String.prototype.slugify) { String.prototype.slugify = function () { return this.toString().toLowerCase() .replace(/[àÀáÁâÂãäÄÅåª]+/g, 'a') // Special Characters #1 .replace(/[èÈéÉêÊëË]+/g, 'e') // Special Characters #2 .replace(/[ìÌíÍîÎïÏ]+/g, 'i') // Special Characters #3 .replace(/[òÒóÓôÔõÕöÖº]+/g, 'o') // Special Characters #4 .replace(/[ùÙúÚûÛüÜ]+/g, 'u') // Special Characters #5 .replace(/[ýÝÿŸ]+/g, 'y') // Special Characters #6 .replace(/[ñÑ]+/g, 'n') // Special Characters #7 .replace(/[çÇ]+/g, 'c') // Special Characters #8 .replace(/[ß]+/g, 'ss') // Special Characters #9 .replace(/[Ææ]+/g, 'ae') // Special Characters #10 .replace(/[Øøœ]+/g, 'oe') // Special Characters #11 .replace(/[%]+/g, 'pct') // Special Characters #12 .replace(/\s+/g, '-') // Replace spaces with - .replace(/[^\w\-]+/g, '') // Remove all non-word chars .replace(/\-\-+/g, '-') // Replace multiple - with single - .replace(/^-+/, '') // Trim - from start of text .replace(/-+$/, ''); // Trim - from end of text }; } |
No GitHub você encontrará no endereço: https://gist.github.com/gabrielfroes/e90a53f96ed71fb201d133395003ada4
Um exemplo muito simples de utilização seria:
|
1 2 |
var frase = "O site Código Fonte é o melhor da tecnologia de [a-Z]."; var url = frase.slugify(); |
É isso, espero que essa função seja útil para vocês!
Você pode se interessar
A História Perdida do LCD
Carlos L. A. da Silva - 20 de novembro de 2018Como a RCA foi pioneira na tecnologia, mas se deixou ultrapassar por falta de visão comercial, mal gerenciamento e descaso.
PWA // Dicionário do Programador
Thais Cardoso de Mello - 19 de novembro de 2018O Dicionário do Programador é o quadro semanal onde você aprende mais sobre termos, tecnologias ou palavras do maravilhoso mundo da programação! Ele é uma ideia antiga, que tomou vida graças a grande ajuda da HostGator Brasil. O tema da vez é: PWA. // Nosso parceiro Ultra-Mega-Power 🐊 HOSTGATOR ▪ https://codft.me/hostgator ☝🏻 COMPRE NOSSAS CAMISETAS […]
Promoções de Jogos do Final de Semana (16/11)
Carlos L. A. da Silva - 16 de novembro de 2018Confira as melhores ofertas de jogos de PC para o final de semana.
Mais publicações
Tatuagens e o Dress Code no Mundo da Programação // CAC #007
Thais Cardoso de Mello - 15 de novembro de 2018
Prêmio Microinfluenciadores está com votações abertas para escolha dos mais relevantes
Redação - 14 de novembro de 2018Como ativar a defesa contra ransomware do Windows 10
Carlos L. A. da Silva - 16 de novembro de 2018Tatuagens e o Dress Code no Mundo da Programação // CAC #007
Thais Cardoso de Mello - 15 de novembro de 2018
A História Perdida do LCD
20 de novembro de 2018
PWA // Dicionário do Programador
19 de novembro de 2018
Promoções de Jogos do Final de Semana (16/11)
16 de novembro de 2018
Como ativar a defesa contra ransomware do Windows 10
16 de novembro de 2018
Deixe um Comentário