Hugo环境配置
点击进入Hugo下载地址 ，下载最新的release文件。
创建博客网站
准备步骤
在hugo对应的文件夹内打开cmd，输入hugo new site 你的文件夹名，可以看到多出一个新的空文件夹。
进入空文件夹，在cmd中输入hugo service build。可以看到网站在localhost:1313转发，在浏览器中输入该网址即可看到当前网站的内容。
下载Hugo主题
在Hugo官网上进入Theme，下载需要的主题文件，解压后放入网站文件夹的theme子文件夹。
接着在下载的主题文件夹中复制content文件夹和hugo.yaml（或hugo.toml）文件，粘贴到你的网站文件夹中。
打开主题的配置文件，找到theme: hugo-theme-stack一行，这里标明所使用主题的名称，须保持名称与主题文件夹的名称相同，否则要修改其一。再次执行hugo service build，即可看到使用了主题的网站。
创建自定义内容
Hugo网站的文章内容均在content文件夹中，每篇文章对应一个子文件夹。
每篇文章均采用Markdown语法书写，通常在文章开头有类似的配置文字：
1---
2title: xxxxx # 文章的标题
3description: xxxxx # 文章的副标题
4date: xxxxx # 文章的日期
5slug: xxxxx # 文章在静态页面所属的文件夹
6categories:
7 - xxxxx # 文章所属类别
8---
必须包含这些内容网站才会显示对应文章。
文章正文参照Markdown语法规则。
Hugo构建命令
完成网页的编辑后，需执行Hugo的构建命令，方能生成网页文件。
1hugo server -D #构建本地网页
2hugo #构建在线网页
3hugo --cleanDestinationDir #清理构建文件夹
注意事项
使用
hugo server -D命令构建的是本地网页，遇到超链接时会重定向到localhost:1313/xxx，不能直接部署到GitHub等服务器上，必须再执行一次hugo命令清除本地链接的内容之后，才能正确部署。
参考视频：
在Github上托管网页
Github网站提供了“Github Pages”功能，允许用户为自己的项目部署一个静态网页。
创建网站仓库
注册Github账号，并创建一个新仓库，命名为你的用户名.github.io。
为什么命名为
你的用户名.github.io？Github的Pages分为两种，一种为用户Pages，另一种为项目Pages。用户Pages每个账号只能拥有一个，域名为
https://你的用户名.github.io；项目Pages数目不限，域名为https://你的用户名.github.io/你的项目名.因此，设置仓库名为
你的用户名.github.io可以使网站地址更简洁。
生成静态网页文件
在命令行中执行
1hugo
执行完成后会在工作区文件夹中出现一个public文件夹，进入该文件夹。
上传文件至Github
参见：玩转Github
参考视频：
插入其他资源
插入图片
1{{< figure src="图片路径" width="宽度" height="高度" title="图片标题" >}}
插入视频
1<!-- 插入Bilibili视频 -->
2{{/* < bilibili bv号 分p(可选) */>}}
Hugo网站搭建内部链接
使用相对路径链接
相对路径是根据当前页面的位置来定位目标页面的路径。这是最简单且常用的方式之一。
假设你的网站目录结构如下：
1content/
2├── about.md
3├── blog/
4│ ├── post1.md
5│ └── post2.md
6└── projects.md
在about.md中链接到 blog/post1.md：
1[访问博客文章](blog/post1)
在 blog/post1.md 中链接到projects.md：
1[查看项目](../projects)
在 blog/post1.md 中链接到同级的post2.md：
1[查看另一篇文章](post2)
使用绝对路径链接
绝对路径是从网站的根目录开始的完整路径。这种方式的好处是不受当前页面位置的影响。
假设你的网站根目录是 https://example.com ，目录结构同上。
在about.md中链接到 blog/post1.md：
1[访问博客文章](/blog/post1)
在 blog/post1.md 中链接到projects.md：
1[查看项目](/projects)
使用 Hugo 的 ref 和 relref 短代码
Hugo 提供了 ref 和 relref 短代码，可以更智能地处理内部链接。这些短代码会根据页面的路径自动解析链接。
ref 短代码：生成绝对路径链接。
1[访问博客文章]({{< ref "blog/post1.md" >}})
relref 短代码：生成相对路径链接。
1[访问博客文章]({{< relref "blog/post1.md" >}})
链接到页面的特定部分
如果你希望链接到页面的某个特定部分（例如某个标题），可以通过锚点（anchor）来实现。
假设post1.md中有一个标题：
1## 我的博客文章内容 {#my-section}
你可以通过以下方式链接到这个部分：
1[查看博客文章的特定部分](/blog/post1#my-section)
链接到页面的别名
如果某些页面有别名（例如在 frontmatter 中定义了 aliases），你可以直接使用别名来链接。
假设post1.md的 frontmatter 中定义了别名：
1---
2title: "我的博客文章"
3aliases:
4 - "/old-post1"
5---
你可以通过以下方式链接到它：
1[访问旧的博客文章](/old-post1)