Amigo 主题使用指南与全自动化部署手册

Vaica · 2026-02-15 · 武汉

欢迎使用 Amigo —— 一款基于 Hugo 的极简朋友圈风格主题。本篇文章将详细介绍如何配置、使用以及如何通过 GitHub Actions 实现全自动化部署。

🎨 主题特性

  • 朋友圈视觉：高度还原微信朋友圈的 UI 体验，支持九宫格图片。
  • 全站 PJAX：页面切换无需刷新，浏览体验极其丝滑。
  • 多字体支持：内置三种精美字体，可在配置文件中一键切换。
  • 三模评论：支持 Artalk、Giscus 或关闭评论，适配不同需求。
  • 毛玻璃效果：在顶栏、友链卡片等处大量运用 Glassmorphism 设计。

📝 撰写文章 (图片管理)

Amigo 主题采用了 Page Bundles 模式管理文章。这意味着每篇文章都应该有一个独立的文件夹，包含 index.md 和它所使用的所有图片。

1. Markdown 语法 (推荐)

直接在文章正文中使用标准的 Markdown 图片语法插入图片。主题会自动提取这些图片并生成朋友圈风格的九宫格布局，同时在正文中过滤掉这些 <img> 标签，避免内容重复。

1今天天气不错！🌸
2
3![图片描述](image1.jpg)
4![图片描述](image2.jpg)
5![图片描述](image3.jpg)

注意：

  • 首页会自动隐藏正文中的图片，仅在画廊区域显示。
  • 详情页也会自动提取图片并进行排版优化。

2. 地点显示

你可以在文章的 Front Matter 中添加 location 字段，它会显示在发布时间右侧。

1---
2title: "我的旅行日记"
3date: 2024-02-15
4location: "大理 · 古城"
5---

🖱️ 交互体验：全文与收起

为了极致还原朋友圈体验，首页实现了原地展开功能：

  • 智能截断：内容超过 6 行时自动显示“全文”按钮。
  • 流式阅读：首页文字取消了强制换行，呈现紧凑的流式布局。
  • 平滑回滚：点击“收起”时，页面会自动滚动回该条动态的顶部，防止视口迷失。
  • 详情页：点击文字区域或评论图标可进入详情页，详情页保留标准 HTML 换行排版。

🚀 全自动化部署 (GitHub Actions)

通过 GitHub Actions，你可以实现“推送即发布”。

1. 部署至腾讯云 EdgeOne Pages

EdgeOne Pages 是部署静态站点的绝佳选择。

步骤：

  1. 在 GitHub 仓库设置中添加 Secret：EDGEONE_API_TOKEN。
  2. 创建 .github/workflows/deploy.yml：
 1name: Deploy to EdgeOne
 2
 3on:
 4  push:
 5    branches: [ main ]
 6
 7jobs:
 8  deploy:
 9    runs-on: ubuntu-latest
10    steps:
11      - uses: actions/checkout@v4
12      - name: Setup Hugo
13        uses: peaceiris/actions-hugo@v3
14        with:
15          hugo-version: 'latest'
16          extended: true
17      - name: Build
18        run: hugo --minify
19      - name: Deploy
20        run: npx edgeone pages deploy ./public --name your-site-name --token ${{ secrets.EDGEONE_API_TOKEN }}

2. 部署至自有云服务器 (SSH + RSYNC)

如果你使用自己的 VPS（如腾讯云 CVM、阿里云 ECS），可以使用以下配置。

步骤：

  1. 生成 SSH 密钥对，将公钥加入服务器 ~/.ssh/authorized_keys。
  2. 在 GitHub 添加 Secrets: SERVER_IP, SERVER_USER, SERVER_SSH_KEY。
  3. 工作流配置：
1      - name: Deploy to Server
2        uses: easingthemes/ssh-deploy@main
3        env:
4          SSH_PRIVATE_KEY: ${{ secrets.SERVER_SSH_KEY }}
5          ARGS: "-avzr --delete"
6          SOURCE: "public/"
7          REMOTE_HOST: ${{ secrets.SERVER_IP }}
8          REMOTE_USER: ${{ secrets.SERVER_USER }}
9          TARGET: "/var/www/your-blog-path"

🛠️ 站点配置

你的 hugo.toml 是博客的大脑。关键配置项：

1[params]
2  # 字体设置: "ZQL", "PingFangQiaoMuTi", "AlimamaFangYuanTi"
3  fontFamily = "AlimamaFangYuanTi"
4
5  # 评论模式: "artalk", "giscus", "none"
6  commentMode = "artalk"

希望这份指南能帮助你更好地使用 Amigo 主题。如有任何疑问，欢迎在下方留言交流！