Hugo是用 Go 语言编写的跨平台静态网站生成器,简单易用性能高。

下文用windows示范安装使用。

一、安装Hugo

下载Hugo:https://github.com/gohugoio/hugo/releases

把hugo文件存放路径添加到系统环境变量Path中,示例为 d:\hugo\hugo.exe

二、生成站点

hugo new site blog

生成名为blog的网站,其目录结构如下

d:\hugo\blog
├── archetypes
│   └── default.md #文章模板
├── config.toml #站点配置文件
├── content #网站内容目录
├── data #网站数据目录,一般是json文件
├── layouts #自定义模板目录,优先使用
├── static #静态文件目录,比如JS、CSS、图片
└── themes #网站主题目录

三、安装主题

Hugo必须配合某个主题一起使用。

可以去这里下载主题:https://themes.gohugo.io/

把主题放到 themes 目录里,按照主题安装说明配置网站,记得修改config.toml文件里面的 theme 字段的值为主题名称。

本站用的是maupassant主题 ,安装后可以进一步 调整主题

四、常用操作

1、新建文章

hugo new post/abc.md

推荐使用 Typora 编辑,记得编写完成修改meta中的 draft 字段如下:

draft: false

不修改就是草稿状态,不会生成和发布文章。

2、本地发布网站

d:\hugo\blog\hugo

默认发布到 d:\hugo\blog\hugo\pubilc 目录,该目录可以同步到远程网站服务器。

3、本地调试(不发布)

d:\hugo\blog\hugo server d

可在 http://localhost:1313 预览网站。

Hugo server 实时检测本地文件变化,自动刷新浏览器,使用 CTRL+C 停止运行。

五、部署到 GitHub Pages

1、在 GitHub 建立 GitHub用户名.github.io 的仓库,点击查看官方教程

2、把 config.toml 的 baseURL 设置为 https://GitHub用户名.github.io

3、安装 GitHub Desktop:https://desktop.github.com/

4、运行 GitHub Desktop,把GitHub用户名.github.io 的仓库克隆到本地,比如 d:\hugo\blog\hugo\GitHub用户名.github.io

5、在 config.toml 顶部区域添加以下字段:

publishdir = "GitHub用户名.github.io"

这样Hugo发布到本地仓库,通过GitHub Desktop 推送到 GitHub Pages,打开https://GitHub用户名.github.io 就可以查看网站了。

六、其他

1、文章URL中去掉 /post/,直接在网站根目录生成文章:

在 config.toml 顶部区域添加以下字段:

[permalinks]
  post = "/:filename/"

2、新建文章meta自带tag和分类空白字段

修改站点目录 /archetypes/default.md 文章模板增加以下内容

tags: []
categories: []

其他需要的也可以在这里添加,省去每次手动输入。

3、Hugo扩展Spoiler标签

4、Hugo如何在新标签页打开链接