Hugo如何添加新页面

前言

Hugo默认在博客首页右上角有4个页面，分别是Home, Archives, Tags和Categories。

对这4个页面做增删改操作，可以直接操作config.toml配置文件。

本文展示如何在Hugo博客网站的右上角添加一个新的关于页面。总体逻辑是把根据文章markdown文件自动生成的html文件作为新页面跳转路径。

操作

修改config.toml，在博客菜单目录配置项后面添加一个新的关于页面。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25


[[menu.main]]             # config your menu              # 配置目录
  name = "首页"
  weight = 10
  identifier = "home"
  url = "/"
[[menu.main]]
  name = "全部文章"
  weight = 20
  identifier = "archives"
  url = "/post/"
[[menu.main]]
  name = "标签"
  weight = 30
  identifier = "tags"
  url = "/tags/"
[[menu.main]]
  name = "分类"
  weight = 40
  identifier = "categories"
  url = "/categories/"
[[menu.main]]
  name = "关于"
  weight = 40
  identifier = "about"
  url = "/about/" 

url表示该页面的url地址。

新增博客markdown文件

博客markdown文件名称要和url里的路径名称相同，比如上面的url路径名称是about，那我们创建的博客的markdown文件名称也叫about，命令如下：
1

$ hugo new post/about.md
把about.md里的内容修改为新页面想展示的内容，注意把markdown文件开头的draft设置为false，因为这个配置项如果是true，那执行下面的hugo命令就不会生成新页面。
执行hugo命令，自动根据markdown文件生成新页面
1

$ hugo
新页面位于public\post\about目录，about目录下就一个index.html文件。
拷贝新页面到public根目录：把上面的about目录完整拷贝一份到public根目录。

拷贝后的目录结构包含public\about\index.html。
再次修改上面创建的markdown文件，draft配置项设置成true，执行hugo命令。

这一步操作是为了不让这个文章出现在博客的首页和全部文章里面，如果你想出现在博客首页和全部文章里，这一步可以省略。
更新public目录到托管平台，就可以在互联网看到了修改后的效果了。比如我用的GitHub Pages，那就直接把public目录的内容push到GitHub上即可。

注意：新页面在自己本地电脑访问localhost的域名会报404，推送到托管平台访问是正常的。

Contents

前言

操作