对于使用 Hexo 搭建博客的同学来说，front-matter 是一个既基础又关键的概念。它就像每篇文章的“身份证”，定义了文章的各种属性。这篇文章将带你深入理解 front-matter 的核心参数，并解决一个常见痛点：如何为你的主题创建独立的标签页和分类页。

什么是 Front-Matter？

简单来说，Front-matter 就是我们创建的 Markdown (.md) 文件最顶部，被 --- 分隔开的那部分 YAML 或 JSON 格式的内容。它用于向 Hexo 指定当前文章的各种元数据。

一个典型的 front-matter 示例如下：

1
2
3
4
5
6
7
8
9
---
title: My Awesome Post
date: 2023-10-27 10:00:00
tags:
  - Tech
  - Life
categories:
  - My Diary
---

核心参数详解

接下来，我们详细解析一些官方文档中可能描述得比较模糊，但在实际使用中至关重要的参数。

layout

  • 作用：指定当前页面使用的布局模板。
  • 说明：Hexo 会根据这个值去 themes/你的主题/layout/ 目录下寻找对应的 .ejs 或 .swig 等模板文件。例如，layout: post 会使用 post.ejs 模板。如果不指定，Hexo 将使用全局配置文件 _config.yml 中定义的 default_layout（通常是 post）。

title

  • 作用：定义文章的标题。这是最核心的参数之一。

date 和 updated

  • date：文章的创建日期。
  • updated：文章的最后更新日期。如果未指定，通常会与 date 相同。

tags

  • 作用：为文章添加标签，方便在标签云或标签页中进行归档和检索。

  • 如何使用：一篇文章可以拥有多个标签，使用 YAML 数组格式。

    1
    2
    3
    4
    tags:
      - PS3
      - Games
      - Review
  • 特点：标签之间是并列关系，没有层级之分。

categories

  • 作用：为文章设置分类，用于结构化的内容组织。

  • 如何使用：

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    # 正确的单级分类
    categories:
      - Diary

    # 具有层级关系的分类
    categories:
      - Tech
      - Frontend
      - Hexo
    # 上述设置会生成 Tech -> Frontend -> Hexo 的层级关系

  • 重要区别：与 tags 不同，categories 具有严格的顺序和层次关系。同一篇文章不能同时存在于两个同级的分类中。例如，以下写法并不是并列分类：

    1
    2
    3
    4
    # 错误示范：这不会创建两个并列分类
    categories:
      - Diary
      - Life

    这种写法会使 Life 成为 Diary 的子分类。因此，为文章选择分类时应力求精准。

  • 作用：覆盖文章的默认永久链接（URL）。

  • 说明：通俗地讲，它就是你这篇文章最终的访问地址。如果不设置，Hexo 将采用全局 _config.yml 文件中的 permalink 配置（默认为 :year/:month/:day/:title/）。通过自定义 permalink，你可以创建更简洁或更具描述性的 URL，例如：

    1
    permalink: hexo-front-matter-guide/

    设置后，这篇文章的访问链接就会变成 你的域名/hexo-front-matter-guide/。

keywords

  • 作用：主要用于 SEO (搜索引擎优化)，在页面的 <meta> 标签中生成关键词。

  • 说明：你可以列出与文章内容最相关的几个关键词，帮助搜索引擎更好地理解你的页面内容。虽然现在搜索引擎对 keywords 的权重已经很低，但设置一下总没有坏处。

    1
    keywords: Hexo, Front-matter, 博客配置, SEO

拓展实战：创建独立的标签页和分类页

很多 Hexo 新手都会遇到一个问题：“我的主题里怎么没有标签页和分类页？” 这个问题曾困扰我一段时间，网上答案也比较零散。下面我将给出清晰的创建步骤。

创建标签页 (Tags Page) 的步骤

  1. 新建页面
    在你的博客根目录下打开命令行，输入以下命令：

    1
    hexo new page "tags"

    这个命令会在 source 文件夹下创建一个名为 tags 的新文件夹，并在其中包含一个 index.md 文件。

  2. 修改页面 Front-Matter
    找到并打开 source/tags/index.md 文件，将其内容修改为：

    1
    2
    3
    4
    5
    6
    ---
    title: 标签
    date: 2019-08-13 09:39:50
    type: "tags"
    layout: "tag"
    ---

    关键参数解释：

    • type: "tags"：这是告诉 Hexo 渲染引擎，这个页面是“标签索引页”，它会自动收集所有文章的标签并在此展示。
    • layout: "tag"：指定该页面使用主题中的标签页专属布局。布局名称可能因主题而异（可能是 tag、tags 或其他），请参考你的主题文档。

  3. 在导航菜单中添加入口
    打开你的主题配置文件（位于 themes/你的主题名/_config.yml），找到 menu 或类似的导航配置项，添加一个指向 /tags/ 的链接。

    示例：

    1
    2
    3
    4
    5
    menu:
      Home: /
      Archives: /archives/
      Tags: /tags/ # 添加这一行
      Categories: /categories/

  4. 生成并部署
    最后，重新生成你的博客文件：

    1
    hexo clean && hexo g

    现在，你的网站导航栏中应该就出现了“标签”选项，点击即可进入所有标签的聚合页面。

创建分类页 (Categories Page) 的步骤

创建分类页的流程与创建标签页完全一致，只需将对应的 tags 替换为 categories 即可。

  1. 新建页面：

    1
    hexo new page "categories"

  2. 修改 Front-Matter (source/categories/index.md)：

    1
    2
    3
    4
    5
    6
    ---
    title: 分类
    date: 2019-08-13 09:40:50
    type: "categories"
    layout: "category"
    ---

    注意：type 变为 "categories"，layout 通常是 "category" 或 "categories"。

  3. 添加菜单入口（在主题的 _config.yml 中）：

    1
    2
    3
    4
    menu:
      Home: /
      Tags: /tags/
      Categories: /categories/ # 添加这一行

  4. 生成并部署。

希望这篇全面的指南能帮助你彻底掌握 Hexo 的 front-matter，并轻松配置出功能完善的个人博客！