前言

本文记录了使用 OpenClaw AI 助手从零开始搭建个人博客的完整过程。整个过程中，我只需要与 OpenClaw 对话，所有的配置、部署、调试工作都由它自动完成。

技术栈

  • Hugo: 极速静态网站生成器
  • PaperMod: 简洁优雅的 Hugo 主题
  • GitHub Actions: 自动化 CI/CD
  • Nginx: Web 服务器 + 反向代理
  • Let’s Encrypt: 免费 SSL 证书
  • OpenClaw: AI 自动化助手

第一阶段：初始化 Hugo 博客

1.1 创建 Hugo 项目

OpenClaw 首先帮我创建了 Hugo 项目结构：

# 创建项目目录
mkdir -p /root/.openclaw/workspace/myblog
cd /root/.openclaw/workspace/myblog

# 初始化 Hugo 站点
hugo new site . --force

# 添加 PaperMod 主题
git init
git submodule add https://github.com/adityatelange/hugo-PaperMod.git themes/PaperMod

1.2 配置 Hugo

创建了 hugo.toml 配置文件：

baseURL = 'https://xyutech.top'
languageCode = 'zh-CN'
title = 'Boss 的博客'
theme = 'PaperMod'

[params]
  author = 'Boss'
  description = '一个简洁优雅的个人博客'
  defaultTheme = 'auto'
  ShowReadingTime = true
  ShowPostNavLinks = true
  ShowBreadCrumbs = true
  ShowCodeCopyButtons = true
  ShowToc = true
  
  [params.profileMode]
    enabled = true
    title = "Boss 的博客"
    subtitle = "记录学习、思考和生活"
    
    [[params.profileMode.buttons]]
      name = "文章"
      url = "/posts/"
    [[params.profileMode.buttons]]
      name = "关于"
      url = "/about/"

[menu]
  [[menu.main]]
    identifier = 'home'
    name = '🏠 首页'
    url = '/'
    weight = 10
  [[menu.main]]
    identifier = 'posts'
    name = '📝 文章'
    url = '/posts/'
    weight = 20
  [[menu.main]]
    identifier = 'about'
    name = '👤 关于'
    url = '/about/'
    weight = 30

[outputs]
  home = ["HTML", "RSS", "JSON"]

1.3 创建第一篇内容

hugo new content posts/hello.md

内容：

---
title: "Hello World"
date: 2026-02-27T21:30:00+08:00
draft: false
---

## 欢迎来到我的博客

这是我的第一篇博客文章！

使用 **Hugo + PaperMod** 搭建，简洁、快速、支持暗色模式。

```python
print("Hello, World!")

更多内容即将更新…


## 第二阶段：配置 GitHub Actions 自动部署

### 2.1 创建 GitHub Actions Workflow

创建 `.github/workflows/deploy.yml`：

```yaml
name: Deploy Hugo Blog

on:
  push:
    branches: [main]
  workflow_dispatch:

jobs:
  build-and-deploy:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v4
        with:
          submodules: recursive
          fetch-depth: 0

      - name: Setup Hugo
        uses: peaceiris/actions-hugo@v3
        with:
          hugo-version: '0.157.0'
          extended: true

      - name: Build
        run: hugo --minify

      - name: Deploy to Server
        uses: appleboy/scp-action@v0.1.7
        with:
          host: ${{ secrets.SSH_HOST }}
          username: ${{ secrets.SSH_USER }}
          key: ${{ secrets.SSH_KEY }}
          source: "public/*"
          target: "/root/.openclaw/workspace/myblog/"
          strip_components: 1

2.2 配置 GitHub Secrets

在 GitHub 仓库设置中添加：

  • SSH_HOST: 服务器 IP
  • SSH_USER: 用户名
  • SSH_KEY: SSH 私钥

第三阶段：服务器配置

3.1 Nginx 配置

创建 /etc/nginx/sites-available/xyutech.top：

server {
    server_name xyutech.top www.xyutech.top;
    root /root/.openclaw/workspace/myblog/public;
    index index.html;

    # 安全头
    add_header X-Frame-Options "SAMEORIGIN" always;
    add_header X-Content-Type-Options "nosniff" always;
    add_header X-XSS-Protection "1; mode=block" always;

    location / {
        try_files $uri $uri.html $uri/ =404;
    }

    # 缓存静态资源
    location ~* \.(css|js|png|jpg|jpeg|gif|ico|svg|woff|woff2|ttf|eot|json)$ {
        expires 1M;
        add_header Cache-Control "public, immutable";
        access_log off;
    }

    # 禁止访问隐藏文件
    location ~ /\. {
        deny all;
        return 404;
    }

    listen 443 ssl;
    ssl_certificate /etc/letsencrypt/live/xyutech.top/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/xyutech.top/privkey.pem;
}

server {
    listen 80;
    server_name xyutech.top www.xyutech.top;
    return 301 https://$server_name$request_uri;
}

3.2 配置 SSL 证书

使用 Certbot 获取 Let’s Encrypt 证书：

certbot --nginx -d xyutech.top -d www.xyutech.top

第四阶段：添加搜索功能

4.1 创建搜索页面

创建 content/search/_index.md：

---
title: "搜索"
layout: "search"
---

4.2 更新菜单配置

在 hugo.toml 中添加搜索菜单：

[[menu.main]]
  identifier = 'search'
  name = '🔍 搜索'
  url = '/search/'
  weight = 40

4.3 遇到的问题与解决

问题: 搜索按钮点击后显示 nginx 404 页面

原因: nginx 配置中对 /search 路径的处理不够明确

解决方案: 添加明确的搜索路径配置

# 明确处理搜索路径
location = /search {
    return 301 /search/;
}

location = /search/ {
    try_files /search/index.html =404;
}

第五阶段：PR 工作流发布文章

5.1 创建新文章分支

git checkout -b post/my-new-article

5.2 编写并提交文章

hugo new content posts/my-new-article.md
git add .
git commit -m "Add new post: 我的新文章"
git push origin post/my-new-article

5.3 创建 Pull Request

在 GitHub 上创建 PR，经过 Review 后 Merge 到 main 分支，GitHub Actions 自动部署。

完整工作流程

graph LR
    A[本地编写文章] --> B[创建分支]
    B --> C[Push 到 GitHub]
    C --> D[创建 PR]
    D --> E[Review & Merge]
    E --> F[GitHub Actions 构建]
    F --> G[自动部署到服务器]
    G --> H[线上发布]

总结

通过 OpenClaw 的协助，整个博客搭建过程变得非常流畅：

  1. 零配置负担: 所有配置文件自动生成
  2. 自动化部署: Push 代码即可自动发布
  3. HTTPS 支持: 自动配置 SSL 证书
  4. 搜索功能: 内置 Fuse.js 搜索

整个过程展示了 AI 助手在自动化运维和开发工作流中的强大能力。

参考链接

本文由 OpenClaw 协助整理发布