使用hugo搭建博客的简单流程-win10

安装 Hugo(extended扩展版)

//Scoop 安装
https://github.com/ScoopInstaller/Install#readme
~ $ scoop install hugo-extended

生成Hugo站点,在目标目录执行:

~ $ hugo new site hugo-blog
~ $ cd hugo-blog

安装主题

~/hugo-blog $ git init
~/hugo-blog $ git submodule add --depth 1 https://github.com/reuixiy/hugo-theme-meme.git themes/meme

使用主题的config替换hugo的config文件

~/hugo-blog $ rm config.toml && cp themes/meme/config-examples/zh-cn/config.toml config.toml

添加一个页面于文章

~/hugo-blog $ hugo new "posts/hello-world.md"
~/hugo-blog $ hugo new "about/_index.md"

测试安装结果

~/hugo-blog $ hugo server -D

通过github发布

在创建github个人主页仓库

仓库名称为 <username>.github.io (public)

在github创建hugo项目仓库用于文章发布

与本地hugo目录绑定(private)即可

将刚刚创建的hugo-blog下除了.git文件以外的文件放入hugo仓库的本地目录

在hugo目录下:

  1. 将public目录中的内容移到 <username>.github.io仓库中
  2. 将public目录删除
  3. 将hugo目录的config文件中的baseUrl设为 <username>.github.io

运行

~/hugo-blog $ git submodule add -b main https://github.com/<USERNAME>/<USERNAME>.github.io.git public

将hugo目录中的public目录与<username>.github.io的public目录绑定(这里建议使用SSH地址)

添加评论模块

利用utterances项目,将某个public仓库的issue作为评论区。

image

修改config文件

 # 是否开启(全局设置)
    enableComments = true
    # 说明:文章的 Front Matter 中的 `comments`
    #      的优先级高于此处

    # 直接加载评论,不需要手动点击按钮加载
    autoLoadComments = true

## Utterances
    enableUtterances = true
    utterancesRepo = "longchuanzheng/longchuanzheng.github.io"
    utterancesIssueTerm = "pathname"
    utterancesTheme = "github-light"
    utterancesThemeDark = "photon-dark"
    utterancesLabel = "comment"
    # 说明:https://utteranc.es/

修改页面

在hugo目录的content目录下创建新的页面

修改config文件中的必要信息

运行py脚本更新public目录中的内容将其push到 <username>.github.io中

 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
#!/bin/sh

# 任一步骤执行失败都会终止整个部署过程
set -e

printf "\033[0;32mDeploying updates to GitHub...\033[0m\n"

# 构建静态内容
hugo # if using a theme, replace with `hugo -t <YOURTHEME>`

# 切换到 Public 文件夹
cd public

# 添加更改到 git
git add .

# 提交更改
msg="rebuilding site $(date)"
if [ -n "$*" ]; then
msg="$*"
fi
git commit -m "$msg"

# 推送到远程仓库
git push origin main

该脚本将public目录下的内容推送到 <username>.github.io仓库中。

参考内容:

安装hugo:https://gohugo.io/getting-started/quick-start/

安装主题:https://github.com/reuixiy/hugo-theme-meme

大体流程:

安装评论:

updatedupdated2023-02-232023-02-23