Day 10：为你的 Hexo 增加页面：标签、分类与自订页面

昨天介绍新增文章，今天要来介绍新增页面。这两者有什麽差别呢？一般来说如果是跟网站有关的资讯、或是一些关於你的介绍，这种比较不适合发在一般文章的，就很适合建立一个页面，并以 Next 布景主题为例，设定能透过主选单连到页面。

如何建立自订页面？

建立页面的指令格式如下：

hexo new page "页面名称（网址用）"

以上图范例为例，我建立了一个 about 页面，打算利用这个页面介绍我自己与这个网站，大家也可以依照使用情境建立页面。

存放位置与页面资讯

有别於文章与草稿有各自不同的目录存放，页面档案是独立存放於一个目录中的，像是我刚刚建立了 about 页面，页面存放位置於 ./source/about 内，而档案名称为 index.md。

因此如果你要将草稿建立成页面，假设你的页面叫做「message」，就要在 source 目录内建立一个名为 message 的目录，将草稿档案移进去目录後，将档案名称改为 index.md 即可。

页面资讯

页面预设的资讯仅有 title 以及 date，分别是页面标题与时间，不过这边我们可以加一个 comments，原因是若之後我们在 Hexo 增加文章留言功能，预设页面是可以留言的，但有时候我们会希望页面就是专门提供资讯，不开放留言，就可以增加这段语法。

title: about
date: 2021-08-28 18:46:39
comments: false <!-- 设定为 false 表示不开放留言 -->

接下来的内容，就一样使用 Markdown 随你打啦～後续一样透过指令 hexo g 建立页面就能看到成果了。

建立文章分类与标签页

而 Hexo 本身提供一些能够连动网站资讯的页面，例如文章分类与标签页，建立的方式就跟建立自订页面一样：

# 建立标签页
hexo new page tags
# 建立分类页
hexo new page categories

不过建立之後，我们必须再做一个动作，以标签为例，我们开启页面後，一样会看到预设的 title 与 date 资讯，此时如果要连接 Hexo 资讯，就要加上 type 资讯，并设定为 tags，范例如下：

title: 标签
date: 2021-08-28 19:15:03
type: tags <!-- 将页面类型设定为 tags（标签） -->
comments: false <!-- 设定页面不开放留言 -->

於是，就可以在标签页看到所有标签啦！

分类页也是利用同样的方式，增加 type 并设定为 categories 即可。

利用主选单连到页面（以 Next 布景主题为例）

因为是设定 Next 方面的内容，所以我们要开启 ./themes/next/_config.yml 档案并找到以下语法：

menu:
  home: / || fa fa-home
  #about: /about/ || fa fa-user
  #tags: /tags/ || fa fa-tags
  #categories: /categories/ || fa fa-th
  archives: /archives/ || fa fa-archive
  #schedule: /schedule/ || fa fa-calendar
  #sitemap: /sitemap.xml || fa fa-sitemap
  #commonweal: /404/ || fa fa-heartbeat

我们只要把 #tags、#categories 解除注解即可，另外 Hexo 很贴心，连同 about 也一起加了 XD 一样，将 #about 那一行解除注解即可。不过如果你的关於页面不是设定成 about（或许可能是你的英文名字），那就改成你设定的名称即可。

後记

如此一来网站基本该有的内容都大致上完成了，虽然後续还有像是留言版的功能，不过这部分就先暂缓，毕竟要先上传到网路上，才会有人留言嘛！（除非你要自言自语我也是没意见啦 XD）

因此明天，我们就要将 Hexo 上传到 Github Pages 上啦，届时你的部落格就能够呈现在网路上了。页面建立好後，就等明天来见证这历史的一刻吧（？）

本篇文章同步发布於我的部落格 Gui Blog