Hugo作品集启动器

portfolio-hugo-theme-cactus — Hugo 作品集模板

作者 fu4303

基于 Hugo 的个人博客主题,从 Hexo 的 cactus 主题移植而来,提供配色主题、项目列表、社交链接、评论与数学公式等配置项。

看看你的网站会是什么样

浏览真实页面截图,比较内容排版与手机效果。点击下方缩略图切换,放大查看整页细节。

3 个预览视图
桌面端首页1 / 3
桌面端截图首屏预览

由服务器浏览器实际访问页面后截取。

全部页面与视图 3

截图用于了解视觉与布局,交互效果请以实际项目为准。

采集于 2026-10-03查看来源

值得关注的模板亮点

从已有项目资料中,快速了解它的特点。

01

从 Hexo 的 cactus 主题移植到 Hugo 的个人博客主题

02

提供 dark、light、white、classic 四种配色主题

03

支持通过 data 目录下的 yaml/toml/json 文件配置项目列表

04

社交链接使用 Font Awesome 图标名称配置

05

评论、MathJax 可全局设置,也可在单篇文章 front matter 中覆盖

06

代码高亮使用 Hugo 内置语法高亮,分析统计使用 Hugo 内置 analytics 模板

模板详细介绍

这是一个 Hugo 主题,用于搭建个人博客站点,由 @probberechts 的 Hexo 主题 cactus 移植而来。仓库说明中明确标注部分功能仍在开发中,并附有 TODO 列表。

主题通过站点配置文件(config.toml)进行设置。可选项包括:colortheme 提供 dark、light、white、classic 四种配色;css 参数可加载一个或多个自定义样式表,在主主题 CSS 之后加载;菜单通过 [[menu.main]] 定义首页、文章列表、标签、关于等入口。首页可设置 description(支持 Markdown)、mainSection 与 mainSectionTitle,并可选择只显示最近若干篇文章或显示全部,以及是否显示标签概览和项目列表。

项目列表读取 data 目录下的 projects.yaml、toml 或 json 数据文件,未检测到数据文件时不显示该区块。社交链接通过 [[params.social]] 配置,name 需对应 Font Awesome 图标名称。版权信息写入 .Site.Copyright,主题会在头部追加当前年份。

评论默认关闭,需在 params.comments 中启用,目前仅支持 Disqus,需要提供 disqusShortname;也可在单篇文章的 front matter 中用 comments 字段单独控制。代码高亮使用 Hugo 内置的语法高亮配置。分析统计使用 Hugo 内置的 analytics 模板,需填写 googleAnalytics 跟踪 ID,并可通过 googleAnalyticsAsync 切换为异步代码。RSS 默认不生成,需设置 params.rss 为 true。MathJax 可通过 params.mathjax 全局开启,或在单篇文章 front matter 中覆盖。文章归档页可通过 showAllPostsArchive 关闭分页,按时间顺序显示全部文章。

安装方式为将主题克隆到 Hugo 站点的 themes 目录,并在站点配置中把 theme 设为 cactus,随后用 hugo server 本地预览,发布方式参见 Hugo 的托管与部署文档。仓库采用 MIT 许可。

Hugo作品集启动器

适合你的项目吗?

适用场景

  • 搭建以文章列表和标签为主的个人博客
  • 在首页展示个人项目清单并链接到外部地址
  • 撰写包含数学公式的技术文章并开启 MathJax 渲染
  • 为文章接入 Disqus 评论并按篇控制是否显示

适合人群

  • 使用 Hugo 构建静态站点的个人博主
  • 从 Hexo cactus 主题迁移、希望保留相似版式的用户
  • 需要项目列表、社交链接与多种配色切换的博客作者

上手与定制指南

结合仓库当前版本的说明,按下面的资料检查内容、配置与运行要求。

  1. 1

    将主题克隆到 Hugo 站点的 themes 目录,并在站点配置中设置 theme = "cactus"

  2. 2

    项目列表需在 data 目录创建 projects.yaml、toml 或 json 文件,否则该区块不显示

  3. 3

    启用评论需设置 params.comments.enabled 为 true 并提供 disqusShortname,目前仅支持 Disqus

  4. 4

    RSS 默认不生成,需在 params 中设置 rss = true;MathJax 需设置 mathjax = true

  5. 5

    仓库说明列出 I18n、本地搜索、toc 模板、图库等尚未完成,使用前请留意

查看仓库使用说明

授权与来源资料

使用条件与限制

免费使用 · 保留许可声明

本次收录的是公开仓库中采用 MIT 许可的免费版本;免费范围为该版本代码,不代表外部服务或第三方素材免费。

使用时需要遵守

  • 允许免费使用、修改、商用和分发该版本代码。
  • 分发代码副本或实质性部分时,保留原作者版权声明和完整 MIT 许可声明。
  • 代码按现状提供;担保与责任限制以原许可证及适用法律为准。

额外费用与待核对事项

  • 启用评论功能需先注册 Disqus 账号并获取 shortname,属于第三方外部服务依赖,非主题自带能力。
  • 使用分析统计功能需自行提供 Google Analytics 跟踪 ID,依赖外部服务。
  • 社交链接的 name 字段需填写 Font Awesome 图标名称,依赖该图标库的命名。
  • 仓库明确说明部分功能仍在开发中,I18n、本地搜索、toc 模板、图库等尚未完成,不应视为完整成品。
  • 演示图片、字体、图标及其他第三方素材需按各自许可核对,不能仅凭代码的 MIT 许可判断。
  • 域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
查看原文依据

Permission is hereby granted, free of charge

许可证原文

Before using disqus, you need to register and get your [disqus shortname](https://help.disqus.com/en/articles/1717111-what-s-a-shortname).

README 原文

Add you tracking id in your site config.

README 原文

The `name` key expects the name of a [Font Awesome icon](https://fontawesome.com/icons?d=gallery&s=brands).

README 原文

Some works are still in progress. See [TODOS](#todos) below.

README 原文
https://github.com/fu4303/portfolio-hugo-theme-cactus/blob/main/LICENSEhttps://github.com/fu4303/portfolio-hugo-theme-cactus/blob/main/README.md

DeepSeek 根据仓库许可证和 README 整理 ·2026-10-03。结果仅覆盖已读取资料,依赖、图片、字体及后续条款变更以各自原文为准。

项目核对记录与介绍依据

模板资料

来源平台
GitHub
资料与维护参考分
资料一般 · 70 / 100
技术栈
Hugo
网站类型
作品集 · 启动器
这个分数如何计算

本站按许可资料(最高30分)、演示链接(12分)、预览图(10分)、Star数(15分)、记录的维护时间(15分)、描述完整度(8分)、功能记录(5分)和分类资料(5分)计算。它不是代码、安全或性能测试,也不是 Google 评分;有链接不代表已实测可用。

这个项目需要核对什么

记录的仓库更新时间
2021-07-23
截图检查日期
2026-10-03

已收录演示链接。请用你的内容与屏幕尺寸检查;有演示不代表表单、认证或支付已经可用。

目录记录的主要技术栈是 Hugo。请通过依赖清单和锁文件核对实际版本与托管要求。这些说明基于收录资料,不代表代码审计或部署实测。

查看具体选型方法 →

介绍的制作与核对状态

介绍由 AI 辅助整理目录与仓库资料。仓库作者不等于这篇介绍的审核者。

已完成服务器许可规则与 AI 来源核对;未经过人工编辑审核。

查看当时使用的来源资料

SHA-256: 73d7a58a1fe58c33ad72fef7224b4bb26320f6b34b686f5c0e9d814a8c825935

2026-10-03T03:04:04.642Z

来源文件 / 仓库
## Cactus

A hugo theme for personal blog. Fork from hexo theme [cactus](https://github.com/probberechts/hexo-theme-cactus) created by @probberechts.

[Live demo on github pages](https://www.takuzen.me/hugo-theme-cactus/).

Some works are still in progress. See [TODOS](#todos) below.

## Install

1. clone cactus to your hugo site's `themes` folder.
```
git clone https://github.com/monkeyWzr/hugo-theme-cactus.git themes/cactus
```

2. change your theme to cactus in your site config
```toml
# config.toml

theme = "cactus"
```

3. config your site. See [Config] or a [complete config sample](exampleSite/config.toml)
4. test your site
```
hugo server
```

5. publish your site in your prefered way. See hugo's doc: [Hosting & Deployment](https://gohugo.io/hosting-and-deployment/)

## Config

### Color themes

```toml
[params]

  colortheme = "white" # dark, light, white, or classic
```

### Custom CSS

```toml
[params]
  css = ["css/custom.css"]
```

You can add multiple custom stylesheets which will be loaded after the main theme css.
For example, the above line will load the CSS-file placed at `/static/css/custom.css`.

### Navigation

```toml
# Main menu which appears below site header.
[[menu.main]]
name = "Home"
url = "/"
weight = 1

[[menu.main]]
name = "All posts"
url = "/posts"
weight = 2

[[menu.main]]
name = "Tags"
url = "/tags"
weight = 3

[[menu.main]]
name = "About"
url = "/about"
weight = 4
```

### Homepage settings

* description: description will be displayed in the homepage. Markdown syntax is supported in the description string.
```toml
[params]

  description = "Hugo is a general-purpose website framework. Technically speaking, Hugo is a static site generator. Unlike systems that dynamically build a page with each visitor request, Hugo builds pages when you create or update your content. Since websites are viewed far more often than they are edited, Hugo is designed to provide an optimal viewing experience for your website’s end users and an ideal writing experience for website authors."
```

* set your main section (used as the link for the "writings" title on the homepage)

```toml
[params]
  mainSection = "posts"
```

* change the default main section title from Writings, to something else:

```toml
[params]
  mainSectionTitle = "Blog"
```

* Show only the 5 most recent posts (default)

```toml
[params]
  showAllPostsOnHomePage = false
  postsOnHomePage = 5
```
* show all posts

```toml
[params]
  showAllPostsOnHomePage = true
  postsOnHomePage = 5 # this option will be ignored
```

* show tagsoverview (default) or not
* 
```toml
[params]
  tagsOverview = true
```

* show projects list (default) or not.

```toml
[params]
  showProjectsList = true
  projectsUrl = "https://github.com/monkeyWzr"
```

Projects section will not be shown if no data file is detected. See [Projects list](#projects-list) below.

### Projects list

Create your projects data file `data/projects.yaml|toml|json`. Hugo support yaml, toml and json formats.
for former hexo cactus users: please assign your json array to a `list` key.

for example, `data/projects.json`:
```json
{
   "list": [
      {
         "name":"Hexo",
         "url":"https://hexo.io/",
         "desc":"A fast, simple & powerful blog framework"
      },
      {
         "name":"Font Awesome",
         "url":"http://fontawesome.io/",
         "desc":"The iconic font and CSS toolkit"
      }
   ]
}
```

### Social media links

```toml
[[params.social]]
  name = "github"
  link = "https://github.com/monkeyWzr"

[[params.social]]
  name = "email"
  link = "[email protected]" # no need for "mailto:" at the start

[[params.social]]
  name = "linkedin"
  link = "https://www.linkedin.com/in/monkeywzr/"
```

The `name` key expects the name of a [Font Awesome icon](https://fontawesome.com/icons?d=gallery&s=brands).

### Copyright

Assign your copy right to `.Site.Copyright`. Cactus will append current year to the head.

TODO: Customizable copyright year

```toml
copyright = "Zeran Wu" # cactus theme will use site title if copyright is not set
```

### Comments

Comments is disabled by default. Enable comments in your `.Site.Params`.
```toml
[params]
  [params.comments]
    enabled = true
    # engine = "disqus" # in progress
```

You can also enable/disable comments per post. in your posts' front matter, add:
```yaml
comments: true
```

The site config is ignored when `comments` option exists in front matter.

The default engine is disqus. **By now only disqus is supported in cactus.** I will add more options sooner or later. See [Comments Alternatives](https://gohugo.io/content-management/comments/#comments-alternatives)

Before using disqus, you need to register and get your [disqus shortname](https://help.disqus.com/en/articles/1717111-what-s-a-shortname). Assign your shortname in `.Site.disqusShortname`, or cactus will use `.Site.Title` by default.

```
disqusShortname = "wzr" # cactus will use site title if not set
```

### highlight

Use hugo's built-in [syntax highlighting](https://gohugo.io/getting-started/configuration-markup#highlight).

default config:

```toml
[markup]
  [markup.highlight]
    codeFences = true
    guessSyntax = false
    hl_Lines = ""
    lineNoStart = 1
    lineNos = false
    lineNumbersInTable = true
    noClasses = true
    style = "monokai"
    tabWidth = 4
```

### Analytics

Cactus uses hugo's bulit in [analytics templates](https://gohugo.io/templates/internal#google-analytics)
Add you tracking id in your site config. By default cactus uses synchronous tracking code. You can switch to asynchronous tracking by set `googleAnalyticsAsync` to `true`.

```toml
googleAnalytics = "UA-123-45"
googleAnalyticsAsync = true # not required
```

### RSS

The rss feed is not generated by default. you can enable it in your site config:

```toml
[params]
  rss = true
```

The rss link will be `https://example.com/index.xml` assuming your `baseURL` is set to `https://example.com/`

Please also check [Configure RSS](https://gohugo.io/templates/rss/#configure-rss)

### Mathjax

Cactus supports mathjax. Just add `mathjax` option in your site config:
```toml
[params]
  mathjax = true  # not required
```

You can also enable/disable mathjax per post. In your posts' front matter, add:
```yaml
mathjax: true # or false
```

The site config will be ignored when `mathjax` option exists in front matter.

### Archive 
Pagination on posts archive can be disabled to show all posts in chronological order

```toml
[params]
  showAllPostsArchive = true # or false (default)
```

## TODOS

- [ ] More comments engines
- [x] RSS
- [ ] I18n
- [x] Analytics
- [ ] Local Search
- [ ] toc template
- [ ] Customizable copyright year
- [ ] gallery
- [ ] expose [mathjax configuration](https://docs.mathjax.org/en/latest/web/configuration.html#web-configuration) 

## License

MIT
反馈内容错误

看看同类模板

对比同技术栈与用途的模板,找到更适合的视觉与内容结构。