跳过正文
  1. 文章/

如何使用Hugo&Blowfish搭建博客

前言
#

本文记录本站的完整搭建过程:使用 Hugo 作为静态站点生成器,搭配 Blowfish 主题,最终托管在 GitHub Pages 上,并借助 GitHub Actions 实现「推送即发布」的自动化部署。

整体技术栈如下:

  • Hugo:基于 Go 的静态站点生成器,构建速度快。
  • Blowfish:功能丰富、可高度自定义的 Hugo 主题。
  • GitHub Pages:免费的静态网页托管服务。
  • GitHub Actions:自动构建并部署站点的 CI 工具。

环境准备
#

安装 Go
#

Hugo 本身基于 Go 开发。若使用 go install 方式安装 Hugo,需要先配置好 Go 环境。 可前往 Go 官网 下载安装,安装后验证:

go version

安装 Hugo
#

在已有 Go 环境的前提下,直接通过 go install 安装指定版本的 Hugo:

go install github.com/gohugoio/hugo@v0.151.0

注意:Blowfish 主题依赖 Hugo 的 extended 版本(支持 SCSS 编译)。 若使用包管理器安装,请确认安装的是 extended 版本。

安装完成后验证版本:

hugo version

创建站点
#

在工作目录下新建一个 Hugo 站点:

hugo new site muzimu
cd muzimu
git init

安装 Blowfish 主题
#

Blowfish 推荐使用 Git Submodule 的方式引入主题,便于后续更新。

引入主题
#

git submodule add -b main https://github.com/nunocoracao/blowfish.git themes/blowfish

执行后会在项目根目录生成 .gitmodules 文件,内容类似:

[submodule "themes/blowfish"]
  path = themes/blowfish
  url = git@github.com:nunocoracao/blowfish.git
  branch = main

更新主题
#

后续需要升级主题版本时,执行:

git submodule update --remote --merge

克隆仓库后初始化子模块
#

在新机器上克隆本仓库后,需要同步并拉取子模块内容:

git submodule sync
git submodule update --init --remote

配置站点
#

Blowfish 的配置文件位于 config/_default/ 目录下,按职责拆分为多个文件, 而非集中在单一的 hugo.toml 中。核心文件如下:

文件作用
hugo.toml站点基础配置(主题、baseURL、语言、分类法等)
params.toml主题参数(外观、布局、功能开关等)
languages.zh-cn.toml中文语言及作者信息
languages.en.toml英文语言配置
menus.zh-cn.toml中文导航菜单
markup.tomlMarkdown 渲染与代码高亮设置

基础配置
#

hugo.toml 中需指定主题与站点地址:

theme = "blowfish"
baseURL = "https://muzimu.github.io/"
defaultContentLanguage = "zh-cn"

enableRobotsTXT = true
enableEmoji = true

[taxonomies]
  tag = "tags"
  category = "categories"
  author = "authors"
  series = "series"

作者信息
#

languages.zh-cn.toml 中配置作者头像、昵称与社交链接:

[params.author]
  name = "muzimu"
  image = "img/avatar.jpg"
  headline = "木子木"
  links = [
    { github = "https://github.com/muzimu" },
    { bilibili = "https://space.bilibili.com/448045568" },
  ]

更多主题参数说明可参考 Blowfish 官方文档: https://blowfish.page/zh-cn/docs/configuration/#theme-parameters

创建文章
#

使用 hugo new 基于 archetype 模板创建文章。本站采用「页面包」(Page Bundle) 组织方式,每篇文章独占一个目录,便于管理配图等资源:

hugo new content content/posts/Hugo/index.md

文章顶部的 Front Matter 示例(YAML 格式):

---
title: "文章标题"
summary: "文章摘要"
isCJKLanguage: true
date: 2025-09-06T17:42:06+08:00
tags:
  - 标签
---

设置 isCJKLanguage: true 可让 Hugo 正确统计中文字数与阅读时长。

本地预览
#

启动本地开发服务器,默认地址为 http://localhost:1313/

hugo server

若文章仍处于草稿状态(draft: true),需加上 -D 参数才会被渲染:

hugo server -D

部署到 GitHub Pages
#

准备仓库
#

需要两个仓库:

  • 源码仓库:存放 Hugo 工程源码(如 muzimu/muzimu)。
  • 发布仓库:存放构建产物,即 GitHub Pages 站点(如 muzimu/muzimu.github.io)。

配置自动部署
#

在源码仓库根目录创建 .github/workflows/hugo.yaml,每次向 main 分支推送时, GitHub Actions 会自动构建并将 public/ 目录发布到目标仓库:

name: github pages

on:
  push:
    branches:
      - main

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
        with:
          submodules: true       # 拉取 Blowfish 主题子模块
          fetch-depth: 0         # 获取完整历史,供 .GitInfo / .Lastmod 使用

      - name: Setup Hugo
        uses: peaceiris/actions-hugo@v2
        with:
          hugo-version: 'latest'
          extended: true         # 使用 extended 版本

      - name: Build
        run: hugo --minify       # 构建并压缩静态资源

      - name: Deploy
        uses: peaceiris/actions-gh-pages@v3
        with:
          external_repository: muzimu/muzimu.github.io
          personal_token: ${{ secrets.PERSONAL_TOKEN }}
          publish_dir: ./public
          publish_branch: main

配置访问令牌
#

由于要发布到另一个仓库,不能使用默认的 GITHUB_TOKEN,需要:

  1. 在 GitHub Personal Access Tokens 页面生成一个具有 repo 权限的令牌。
  2. 在源码仓库的 Settings → Secrets and variables → Actions 中, 新增一个名为 PERSONAL_TOKEN 的 Secret,值为上一步生成的令牌。

安全提示:令牌等同于账号密码,切勿直接明文写入工作流文件并提交, 否则会被 GitHub 自动吊销且存在泄露风险,务必通过 Secrets 引用。

启用 Pages 并访问
#

推送代码后,等待 Actions 构建完成,在发布仓库的 Settings → Pages 中确认发布分支,随后即可通过 https://<用户名>.github.io/ 访问站点。

小结
#

至此,一个基于 Hugo + Blowfish 的个人博客就搭建完成了。日常写作只需新建文章、 本地预览确认效果,再 git push 即可自动发布,整个流程清爽高效。