Hugo 博客写作指南(一):Front Matter 基础属性详解
本文是 Hugo 博客写作指南系列的第一篇,详细介绍 Front Matter 的基本属性和使用方法。
在开始写作之前,了解 Hugo 的 Front Matter 是非常重要的。Front Matter 是 Markdown 文件顶部的元数据区域,用于定义文章的标题、日期、分类、标签等属性。
什么是 Front Matter?
Front Matter 是 Markdown 文件最顶部的一段配置区域,使用 YAML、TOML 或 JSON 格式编写。在 ChangAn 主题中,我们使用 YAML 格式。
Front Matter 被包裹在两个 --- 之间,例如:
---
title: "文章标题"
date: 2026-03-04T00:00:00+08:00
draft: false
---
基本属性详解
1. weight - 权重
作用: 控制文章的排序顺序,数值越小越靠前。
使用场景:
- 置顶重要文章(设置较小的值,如 1、10)
- 控制系列文章的顺序
示例:
weight: 10 # 置顶文章
weight: 100 # 普通文章
注意事项:
- 默认值为 0
- 仅在相同日期的文章之间生效
- 配合
star: true可以实现置顶效果
2. title - 文章标题
作用: 定义文章的标题,会显示在文章列表、归档页面和浏览器标签页中。
示例:
title: "Hugo 博客写作指南(一):Front Matter 基础属性详解"
title: "使用 Hugo 搭建长安的个人博客"
title: "My First Blog Post"
注意事项:
- 必填字段
- 标题中包含特殊字符(如
:[]{}等)时,建议用英文引号包裹 - 纯英文标题可以不用引号,但建议统一使用英文双引号
" - 避免在标题中使用 YAML 特殊字符,如必须使用需用引号包裹
3. date - 发布时间
作用: 定义文章的发布日期,影响文章在列表中的排序。
格式: YYYY-MM-DDTHH:MM:SS+时区
示例:
date: 2026-03-04T00:00:00+08:00 # 北京时间
date: 2026-03-04T12:30:00+08:00 # 带具体时间
date: 2026-03-04 # 简化格式(推荐)
注意事项:
- 必填字段
- Hugo 会自动使用文件创建时间作为默认值
- 建议使用简化格式
YYYY-MM-DD
4. lastmod - 最后修改时间
作用: 记录文章最后修改的时间,显示在文章信息中。
示例:
lastmod: 2026-03-04T00:00:00+08:00
lastmod: 2026-03-05 # 修改后的日期
注意事项:
- 可选字段
- 当文章内容更新后应该更新此字段
- 可以在
hugo.toml中配置自动获取文件修改时间
5. draft - 草稿状态
作用: 控制文章是否发布。
示例:
draft: true # 草稿,不会生成页面
draft: false # 发布,会生成页面
使用场景:
- 写作中未完成的文章设置为
draft: true - 使用
hugo -D命令可以预览草稿文章
注意事项:
- 生产环境应该设置为
false - 草稿文章不会出现在 RSS 和搜索中
6. description - 文章描述
作用: 定义文章的简短描述,用于 SEO 和文章摘要。
示例:
description: "详细介绍 Hugo 博客的 Front Matter 基本属性"
description: "本文是 Hugo 写作指南系列的第一篇"
注意事项:
- 建议长度在 50-160 个字符
- 会影响搜索引擎的摘要显示
- 不设置时会使用文章内容的前 160 个字符
7. tags - 标签
作用: 为文章添加标签,便于分类和检索。
示例:
tags: ["Hugo", "博客", "写作指南"]
tags: ["技术", "教程", "Front Matter"]
tags: ["JavaScript"] # 单个标签
注意事项:
- 可选字段
- 标签之间用逗号分隔
- 建议使用 3-5 个标签
- 标签会在文章页面和标签页面显示
8. categories - 分类
作用: 将文章归类到特定分类中。
示例:
categories: ["技术教程"]
categories: ["生活", "随笔"]
categories: ["编程", "Web 开发"]
注意事项:
- 可选字段
- 建议使用 1-2 个分类
- 分类会形成独立的分类页面
- 与标签的区别:分类更宏观,标签更具体
9. cover - 封面图
作用: 设置文章的封面图片,显示在文章列表和社交媒体分享中。
示例:
cover: "/images/default-cover.svg"
cover: "/images/posts/my-post-cover.jpg"
cover: "https://example.com/image.png" # 外部链接
注意事项:
- 可选字段
- 建议使用相对路径
- 推荐尺寸:1200x630 像素(适合社交媒体分享)
- 不设置时会使用默认封面图
10. star - 推荐文章
作用: 标记文章为推荐/精选文章。
示例:
star: true # 推荐文章
star: false # 普通文章
使用场景:
- 高质量文章、重要公告
- 系列文章的第一篇
- 入门指南、必读内容
注意事项:
- 可选字段,默认为
false - 推荐文章会在首页特殊显示
- 配合
weight使用效果更好
其他常用属性
aliases - 别名
作用: 为文章创建重定向链接,适用于文章 URL 变更的情况。
示例:
aliases:
- /old-url/
- /previous-post/
slug - URL 别名
作用: 自定义文章的 URL 路径。
示例:
slug: "hugo-frontmatter-guide"
slug: "my-first-post"
type - 内容类型
作用: 定义内容类型,用于特殊布局。
示例:
type: "post"
type: "page"
type: "tutorial"
keywords - 关键词
作用: 添加 SEO 关键词。
示例:
keywords: ["Hugo", "博客", "静态网站", "写作"]
完整的 Front Matter 示例
---
weight: 10
title: "Hugo 博客写作指南(一):Front Matter 基础属性详解"
date: 2026-03-04T00:00:00+08:00
lastmod: 2026-03-04T00:00:00+08:00
draft: false
description: "详细介绍 Hugo 博客文章的 Front Matter 基本属性,包括标题、日期、分类、标签、封面图等常用配置"
tags: ["Hugo", "博客", "写作指南", "Front Matter"]
categories: ["技术教程"]
cover: "/images/default-cover.svg"
star: false
aliases:
- /hugo-guide-01/
slug: "hugo-writing-guide-frontmatter"
keywords: ["Hugo", "Front Matter", "博客写作"]
---
快速开始模板
你可以复制以下模板作为新文章的起点:
---
weight:
title: "文章标题"
date: 2026-03-04
lastmod: 2026-03-04
draft: false
description: "文章简短描述"
tags: ["标签 1", "标签 2"]
categories: ["分类"]
cover: "/images/default-cover.svg"
star: false
---
小结
本文介绍了 Hugo Front Matter 的基本属性,包括:
- ✅ 必填字段:
title,date - ✅ 推荐字段:
description,tags,categories - ✅ 可选字段:
weight,lastmod,cover,star,aliases,slug等
合理使用这些属性可以让你的博客更加规范、易于管理,同时提升 SEO 效果。
下一篇: Hugo 博客写作指南(二):hugo.toml 配置详解
相关文章: