如何在Strapi v4中创建Slug系统

在为客户或您自己构建网站时,您通常希望通过 URL 中的人类可读的 slug 来访问您的公共内容。这将有助于搜索引擎优化 (SEO),并且更容易让用户理解。值得庆幸的是,借助Strapi,您可以轻松地以这种方式访问​​您的内容。

1. 什么是 URL Slug?

slug是一个报纸术语,slug是一个种短标签,只包含字母,数字,下划线或连字符。通常用于url中,在 seo 中,slug叫做url固定链接,是 URL 中最后一个反斜杠之后的部分。例如,您现在正在阅读的文章的 URL 如下所示:

https://hrefgo.com/blog/technical-seo/what-is-a-url-slug

此URL 的 slug 是“/what-is-a-url-slug”。

2. 为什么 Slug 对 SEO 很重要?

slug 对于关键字 SEO 来说非常强大。如果用户要在 Google 上搜索“什么是 slug”,您内容的 URL 结构中的关键字有助于向 Google 表明您的内容应该包含在 SERP 中。如果一个好的 slug 可以清楚地说明网页的内容,它可以改善用户的体验, 还可以帮助 Google 抓取机器人了解如何访问您的页面并确认页面上的内容。

3. Web Slug 对搜索引擎排名很重要吗?

简短的回答是肯定的。在 URL 中使用 SEO 关键字可以帮助您对目标关键字进行排名。Google 使用 URL 作为对您的页面进行排名的一个因素,因此如果 URL slug 包含您的关键字,那么 Google 将更有可能对其进行排名。

4. Strapi中的slug

在 Strapi版本3中,要为您的 Strapi 内容构建 slug 系统,您需要使用代码手动执行几个步骤,以便为您的 Strapi 应用程序自动生成 slug。您还可以在 Strapi v3 文档中查看构建 slug 系统的快速概述。现在,在 Strapi v4 中,为网站内容生成 slugs 变得更加容易。

4.1. Strapi v4 使生成 Slug 变得容易

在 Strapi 版本 4 中,Strapi 附带了新的字段类型UID。这是为了生成在前端使用的唯一标识符。

此功能的强大之处在于,您可以使用内容类型中的另一个字段来为您生成唯一标识符。例如,如果您撰写标题为“Create a slug system in Strapi v4”的博客,系统将为您生成一个 slug,例如“create-a-slug-system-in-strapi-v4”。现在,您无需搞乱代码即可构建开箱即用的 slug 系统!

4.2. 在strapi中自动生成slug的步骤

下面我将概述为 Strapi v4 中的内容生成 slugs 的几个步骤。

  1. 转到内容类型生成器。

    在开发模式下,转到 Strapi 管理面板中的内容类型构建器。

    Go to the content type builder

  2. 创建新的内容类型。

    选择创建新集合类型的选项。

    create a new collection type

  3. 为集合类型命名

  4. 添加具有文本字段类型的标题字段。

  5. 添加 slug 字段。
    选择UID类型, attached field选择例如title

    select UID

    generate slug from a text field

  6. 保存您的内容类型

  7. 为您的新内容类型添加新条目。

  8. 添加标题,然后查看生成的 slug!

    Create an entry with slug

4.3. 在前端使用Slug

您可能想要生成和使用 slugs 的主要原因是出于 SEO 目的。搜索引擎可以使用包含标题关键字的 slugs 更好地理解内容并对其进行排名。为了利用并通过 slug 获取内容,您只需按 slug 过滤内容即可。

下面是对上面 /blogs 端点的 REST API 请求示例:

1
GET /api/blogs?filters[Slug][$eq]=create-a-slug-system-with-strapi-v4

GraphQL 查询示例:

1
2
3
4
5
6
7
8
9
10
11
12
query {
blogs(filters: { Slug: { eq: "create-a-slug-system-with-strapi-v4" } }) {
data {
id
attributes{
Title
Slug
publishedAt
}
}
}
}

5. strapi 系列文章

最新更新以及更多strapi相关文章请访问 鹏叔的技术博客 - strapi

6. 参考文档

什么是固定链接地址(slug)及其对SEO的重要性

How to Create a Slug System in Strapi v4