如何用 hugo 搭建个人博客

第一步：安装Hugo

1.浏览 Hugo 官方的安装指南。

进行初步了解，安装与你的操作系统对应的必要工具。

Hugo 安装指南：https://gohugo.io/getting-started/installing/

2.打开你的终端，输入与操作系统对应的 Hugo 安装命令。

3.安装完成后，输入以下命令来确认

hugo version
安装成功后会跳出以下代码
Hugo Static Site Generator v0.56.3-F637A1EA windows/amd64 BuildDate: 2019-07-31T12:51:49Z

第二步：新建一个Hugo网站

1.进入你想存放 Hugo 网站文件夹的目录。

2.执行以下命令来新建一个Hugo网站

hugo new site '你的博客名' 

第三步：选择 Hugo 主题并克隆至本地目录。

1.打开 Hugo Themes 页面，选择一个你喜欢的主题。

Hugo Themes: https://themes.gohugo.io

下文以选择 ananke主题为例。

cd '你的博客名'            ---进入你的博客目录
git init                  ---初始化本地仓库
git submodule add https://github.com/budparr/gohugo-theme-ananke.git themes/ananke  ---将ananke主题克隆到本地

第四步：编辑配置文件

1. 在 Hugo 网站文件夹的根目录下，使用 Visual Studio Code 打开 config.toml 文件。

   如果你还没用过 Visual Studio Code，建议下载安装一下，是一个很好用的开源文本编辑器，同时支持 Windows、Linux 和 macOS 操作系统。

2. 参考所选 Hugo 主题的配置说明，编辑 config.toml 文件。

   注意：theme 配置项指的是所选主题的名称，必须与所选主题被克隆至的目录名相同。在本例中，即 theme = "ananke"。

第五步：新建一篇文章

hugo new posts/文章名.md

编辑新建的文章，添加内容并保存。

第六步：本地预览网站效果。

1. 启动 Hugo server。

hugo server -d

2.使用浏览器打开 http://localhost:1313 预览。

第七步：构建hugo网站

在 Hugo 网站文件夹的根目录下，执行 hugo 命令来构建。

hugo  ---构建你的 Hugo 网站，默认将静态站点保存到 "public" 目录。

注意：Hugo 会将构建的网站内容默认保存至网站根目录的 public/文件夹中。

第八步：将网站文件夹转换为 Git 库。

1.进入public目录，初始化 Git 库。

cd public    ---生成的 HTML 文件保存在 "public" 目录中，"public" 文件夹会被转换为 Git 库。
git init  ---初始化git仓库

2.查看public目录下的文件，会发现多了 .git 文件。

第九步：将 Git 本地库与远程仓库关联。

1.在github上创建第一个新的仓库

2.运行以下代码来进行关联

git remote add origin '你的远程仓库名'   ---注意是在public目录中运行
git add .   ---将改动添加到暂存区
git commit -m '备注'   ---将改动提交
git push -u origin master   ---上传到远程仓库

第十步：通过 GitHub Pages 预览 HTML

git push完之后再github中点击setting来设置在预览你的hugo博客
(

点击setting设置

)

进入之后找到 Github Pages 然后将Source的None设置成master branch，之后会生成一个网址，就是你的HTML预览的网站了

将none修改成master branch

这是你hugo博客的网站

接下来：之后如何添加一篇博客

之后如果要添加一篇博客，使用如下几步即可：

新建一篇文章，编辑内容。
1.本地预览网站呈现效果。
2.构建 Hugo 网站。
3.提交修改至 Git 本地库。
4.将修改推至远程库。

恭喜！现在你已经走完了全程，拥有了一个自己构建的博客网站。