Slug 生成

把标题文本转成 URL 友好的 slug。

hello-world-你好-世界

什么是Slug 生成?

Slug 生成用于把一段标题或普通文本转换成适合放进 URL 的短字符串(slug),例如把“今天天气真好!”这样的标题转成 `jin-tian-tian-qi-zhen-hao` 或类似形式。转换规则通常包括:把空格替换成短横线 `-`、转成小写字母、去除标点符号和特殊字符、把中文可选择转拼音或保留原字,具体规则可根据站点需要调整。 生成的 slug 最终会出现在页面地址里,例如博客文章地址 `example.com/posts/how-to-learn-vue` 里的 `how-to-learn-vue` 就是一个典型的 slug。

为什么使用Slug 生成?

很多博客系统、CMS、电商平台在生成文章或商品详情页地址时都需要一个干净、可读、对 SEO 友好的 URL 片段,而不是直接用带空格、标点或中文的原始标题拼接地址(那样会被浏览器自动编码成一长串 `%E4%BD%A0%E5%A5%BD` 这样的乱码,既不美观也不利于用户记忆和分享)。手动整理这类字符串很繁琐,需要处理多种边界情况:连续空格、首尾多余的横线、大小写混用、中文与英文混排等。 相比在代码里临时写正则处理,这个工具提供一个稳定、经过验证的转换规则,产品经理、运营在后台填写 URL 别名时也可以直接用,不需要懂正则表达式。

使用示例

英文标题转 slug

输入 “10 Best Practices for React Hooks!”,输出 `10-best-practices-for-react-hooks`:转小写、去掉感叹号、空格换成短横线。

中英混合标题

输入 “Vue3 组合式 API 入门教程”,若采用拼音转换规则,输出类似 `vue3-zu-he-shi-api-ru-men-jiao-cheng`;若采用保留中文的规则,则输出 `vue3-组合式-api-入门教程`,两种策略可按站点 SEO 习惯选择。

清理多余符号

输入 “What is React? (2024 Guide)”,输出 `what-is-react-2024-guide`:连续空格被合并成一个短横线,问号和括号被去除,多余的边界横线也被裁掉。

使用提示

生成 slug 后建议控制长度,过长的 slug(超过几十个字符)既不利于分享也可能被部分平台截断显示;如果站点面向国内中文用户为主,保留中文 slug 通常比拼音更利于用户识别页面内容,可结合实际 SEO 效果选择。

常见问题

保留中文和不保留中文有什么区别?
勾选「保留中文」时,中文字符会被保留在 slug 中(如「你好-世界」);不勾选则只保留英文字母与数字,中文及其它非拉丁字符会被当作分隔符处理,本工具不做拼音转换。
可以自定义分隔符吗?
可以,默认使用短横线 -,也可以改成下划线 _ 等其它符号,连续分隔符会自动合并,首尾多余分隔符会被去除。
数据会上传吗?
不会。转换全部使用浏览器本地正则表达式完成。
中文标题也能生成 slug 吗?
可以,工具支持中文,常见做法是转换为拼音后再拼接短横线,也支持保留中文原字(部分中文站点更倾向直接使用中文 slug 以便阅读),具体取决于你选择的转换模式。
生成的 slug 会不会重复?
工具本身只负责文本转换,不检查数据库里是否已存在相同 slug;如果你的系统要求 slug 唯一,需要在保存时额外做重复校验,通常做法是重复时自动追加数字后缀,如 `how-to-learn-vue-2`。
数字和下划线会被保留吗?
数字通常会保留;下划线视规则而定,多数 slug 规范推荐统一使用短横线而不是下划线,因为搜索引擎通常把短横线当作词语分隔符,下划线则可能被当作单词的一部分。
emoji 和特殊符号会被转换成什么?
emoji、货币符号等无法转写的特殊字符一般会被直接移除,不会保留在结果中,避免生成不合法或过长的 URL。

相关工具

← 返回工具箱· 数据均在浏览器本地处理,不上传服务器。