黑白极简视觉风格
hugo-theme-yinyang — Hugo 启动器模板
作者 joway
YinYang 是一个采用黑白配色的 Hugo 博客主题,支持多语言、Disqus 评论与 SEO 相关配置。
看看你的网站会是什么样
浏览真实页面截图,比较内容排版与手机效果。点击下方缩略图切换,放大查看整页细节。
全部页面与视图 3
截图用于了解视觉与布局,交互效果请以实际项目为准。
值得关注的模板亮点
从已有项目资料中,快速了解它的特点。
支持多语言内容目录
集成 Disqus 评论
提供独立 SEO 模板 partial
assets/images 图片自动转 WebP 并生成 srcset
可配置额外 head、额外 CSS 与文章前后插入内容
模板详细介绍
YinYang 是面向 Hugo 的黑白极简博客主题,仓库采用 MIT 许可,演示站点为 blog.joway.io。主题以黑白配色和极简排版为核心,适合个人写作类博客。
功能方面,主题提供多语言支持(按 contentDir 划分不同语言内容目录)、Disqus 评论集成,以及独立的 SEO 模板 partial。配置项覆盖站点标题、主内容区(mainSections)、页脚社交链接、额外 head 内容、额外 CSS 文件、Twitter Cards、文章头部与尾部插入内容等。
使用上有明确约束:需要 Hugo extended 0.158 及以上版本,旧版本会在 .Language.Label 或 .Site.Language.Locale 上出错;assets/images/ 下的图片会被转换为 WebP 并生成 srcset,static/ 下的图片则原样提供;lazyImage 与 staticPrefix 参数已不再需要,会被忽略;设置 params.extraHeadProductionOnly = true 可在 hugo server 期间跳过 extraHead。安装方式为将仓库作为 git submodule 添加到 themes/yinyang,并在 config.toml 中设置 theme = "yinyang"。
适合你的项目吗?
适用场景
- 搭建个人写作博客
- 运营多语言博客站点
- 需要 Disqus 评论的静态博客
- 希望统一控制文章头尾附加内容的博客
适合人群
- 使用 Hugo 建站的个人博主
- 偏好黑白极简排版的写作者
- 需要多语言内容组织的站点
- 接受以 git submodule 方式管理主题的开发者
上手与定制指南
结合仓库当前版本的说明,按下面的资料检查内容、配置与运行要求。
- 1
需要 Hugo extended 0.158 或更高版本,旧版本会在 .Language.Label / .Site.Language.Locale 上报错。
- 2
在站点根目录执行 git submodule add https://github.com/joway/hugo-theme-yinyang.git themes/yinyang,并在 config.toml 中设置 theme = "yinyang"。
- 3
assets/images/ 下的图片会被转换为 WebP 并生成 srcset,static/ 下的图片保持原样。
- 4
lazyImage 与 staticPrefix 参数已不再需要,设置后会被忽略。
- 5
设置 params.extraHeadProductionOnly = true 可在 hugo server 期间跳过 extraHead。
授权与来源资料
使用条件与限制
免费使用 · 保留许可声明本次收录的是公开仓库中采用 MIT 许可的免费版本;免费范围为该版本代码,不代表外部服务或第三方素材免费。
使用时需要遵守
- 允许免费使用、修改、商用和分发该版本代码。
- 分发代码副本或实质性部分时,保留原作者版权声明和完整 MIT 许可声明。
- 代码按现状提供;担保与责任限制以原许可证及适用法律为准。
额外费用与待核对事项
- 使用该主题必须安装 Hugo extended 版本且不低于 0.158;旧版本会在 .Language.Label 或 .Site.Language.Locale 处报错,无法正常构建。
- 评论功能依赖第三方 Disqus 服务,需自行注册 Disqus 账号并在配置中填写 disqus 账户名,评论数据由外部服务托管。
- 如需站点统计,需接入 Google Analytics 并填写自己的 G-XXXXXXXXXX 跟踪 ID,属于外部第三方服务。
- 示例配置中的订阅链接指向作者本人的 Mailchimp 邮件列表,直接沿用会把读者导向原作者的订阅服务,需替换为自己的链接。
- 示例中的 staticPrefix 指向作者个人 CDN 仓库地址,若照搬会引用他人资源;该参数在新版本中已被忽略。
- 示例页脚包含指向 CC BY-NC-ND 4.0 许可的图片与链接,该许可禁止商用与演绎;若保留此示例内容,需注意其非商业限制,且图片来自作者站点。
- 演示图片、字体、图标及其他第三方素材需按各自许可核对,不能仅凭代码的 MIT 许可判断。
- 域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
查看原文依据
Permission is hereby granted, free of charge
许可证原文
Hugo **extended** >= 0.158 (older versions fail on `.Language.Label` / `.Site.Language.Locale`).
README 原文
[disqus](https://disqus.com) support
README 原文
[services.googleAnalytics] id = "" # e.g. G-XXXXXXXXXX
README 原文
postFooterContent = "<br/><br/><p>Subscribe:<a target='_blank' href='https://mailchi.mp/a1a0d59e7a19/joway'>Joway's Blog</a></p>"
README 原文
staticPrefix = "https://cdn.jsdelivr.net/gh/joway/blog"
README 原文
https://github.com/joway/hugo-theme-yinyang/blob/master/LICENSE.mdhttps://github.com/joway/hugo-theme-yinyang/blob/master/README.mdpostFooterContent = '<br/><br/><p>Subscribe:<a target="_blank" href="https://mailchi.mp/a1a0d59e7a19/joway"><b>Mailchimp</b></a></p><br/><a rel="license" href="http://creativecommons.org/licenses/by-nc-nd/4.0/"><img alt="Creative Commons License" style="border-width:0" src="https://blog.joway.io/images/cc.png" /></a>'
README 原文
DeepSeek 根据仓库许可证和 README 整理 ·2026-10-02。结果仅覆盖已读取资料,依赖、图片、字体及后续条款变更以各自原文为准。
项目核对记录与介绍依据
模板资料
- 来源平台
- Hugo Themes
- 资料与维护参考分
- 资料较完整 · 83 / 100
- 技术栈
- Hugo
- 网站类型
- 启动器
这个分数如何计算
本站按许可资料(最高30分)、演示链接(12分)、预览图(10分)、Star数(15分)、记录的维护时间(15分)、描述完整度(8分)、功能记录(5分)和分类资料(5分)计算。它不是代码、安全或性能测试,也不是 Google 评分;有链接不代表已实测可用。
这个项目需要核对什么
- 记录的仓库更新时间
- 2026-09-12
- 截图检查日期
- 2026-10-02
已收录演示链接。请用你的内容与屏幕尺寸检查;有演示不代表表单、认证或支付已经可用。
目录记录的主要技术栈是 Hugo。请通过依赖清单和锁文件核对实际版本与托管要求。这些说明基于收录资料,不代表代码审计或部署实测。
查看具体选型方法 →介绍的制作与核对状态
介绍由 AI 辅助整理目录与仓库资料。仓库作者不等于这篇介绍的审核者。
已完成服务器许可规则与 AI 来源核对;未经过人工编辑审核。
查看当时使用的来源资料
SHA-256: 36edd2beb801378b9acac161493be342f41c5e7a5e2155ca543e5037e6534790
2026-10-02T14:55:14.019Z
来源文件 / 仓库# YinYang
[YinYang](https://en.wikipedia.org/wiki/Yin_and_yang) is a black-white theme for [Hugo](https://gohugo.io/).
[**Demo**](https://blog.joway.io)
> **Requirements:** Hugo **extended** >= 0.158 (older versions fail on `.Language.Label` / `.Site.Language.Locale`).
> Images under `assets/images/` are converted to WebP with `srcset`; images under `static/` are served unchanged.
> `lazyImage` and `staticPrefix` are no longer needed (native `loading="lazy"` is used) and are ignored.
> Set `params.extraHeadProductionOnly = true` to skip `extraHead` during `hugo server`.
## Feature
- minimalist
- multi-language support
- [disqus](https://disqus.com) support
- [SEO Optimization](https://github.com/joway/hugo-theme-yinyang/blob/master/layouts/partials/seo.html)
## Screenshot

## Installation
From the root of your site:
```shell
git submodule add https://github.com/joway/hugo-theme-yinyang.git themes/yinyang
```
Change `config.toml`:
```toml
theme = "yinyang"
```
## Configuration
### Head Title
```
[params]
headTitle = "Joway Wang"
```
If there is no `headTitle` in params, use `.Site.Params.author.name`.
### Main section
Set your main section:
```
[params]
mainSections = ["posts"]
```
### Multi-Language
```
[languages]
[languages.en]
contentDir = "content/en"
languageName = "English"
weight = 1
[languages.cn]
contentDir = "content/cn"
languageName = "Chinese"
weight = 2
```
Then your posts files should be put into `content/en` or `content/cn`.
### Footer
```
[[params.socials]]
name = "About Me"
link = "https://joway.io"
[[params.socials]]
name = "Github"
link = "https://github.com/joway"
```
### Extra Head
```
[params]
extraHead = '<script src="xxxx.js"></script>'
```
### Extra CSS files
```
[params]
extraCSSFiles = ["css/foo.css", "css/bar.css"]
```
### Twitter Cards
Add the following setting:
```
[params]
twitterCards = true
```
In a post's front matter, include a keyword `images` with a value of a list of
URLs of images that will be used for Twitter Cards.
### Insert content on every post
```
[params]
postHeaderContent = ""
postFooterContent = "<br/><br/><p>Subscribe:<a target='_blank' href='https://mailchi.mp/a1a0d59e7a19/joway'>Joway's Blog</a></p>"
```
### Example
```
# ---------- Site ----------
baseURL = "https://blog.joway.io/"
languageCode = "en-us"
theme = "yinyang"
title = "Random Thoughts"
DefaultContentLanguage = "cn"
canonifyURLs = false
enableRobotsTXT = true
# ---------- Content Language ----------
[languages]
# [languages.en]
# contentDir = "content/en"
# languageName = "English"
# weight = 1
[languages.cn]
contentDir = "content/cn"
languageName = "简体中文"
weight = 2
# ---------- URL ----------
[permalinks]
post = "/blog/:title/"
# ---------- Markdown / Highlight ----------
[markup]
[markup.goldmark]
[markup.goldmark.renderer]
unsafe = true
[markup.highlight]
guessSyntax = true
noClasses = false
style = "tango"
tabWidth = 2
# ---------- Theme Params ----------
[params]
description = "Log something useless, but interesting."
disqus = "joway" # disqus account name
extraHead = ''
favicon = "/logo.png"
headTitle = "Random Thoughts"
mainSections = ["posts"]
postFooterContent = '<br/><br/><p>Subscribe:<a target="_blank" href="https://mailchi.mp/a1a0d59e7a19/joway"><b>Mailchimp</b></a></p><br/><a rel="license" href="http://creativecommons.org/licenses/by-nc-nd/4.0/"><img alt="Creative Commons License" style="border-width:0" src="https://blog.joway.io/images/cc.png" /></a>'
postHeaderContent = ""
staticPrefix = "https://cdn.jsdelivr.net/gh/joway/blog"
# extraBody = '<script>(adsbygoogle = window.adsbygoogle || []).push({});</script>'
# postAds = '<ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-6400651395935595" data-ad-slot="5705651853" data-ad-format="auto" data-full-width-responsive="true"></ins>'
lazyImage = true
# ---------- Analytics ----------
[services]
[services.googleAnalytics]
id = "" # e.g. G-XXXXXXXXXX
# ---------- Author ----------
[params.author]
homepage = "https://joway.io/"
name = "Joway"
# ---------- Social Links ----------
# [[params.socials]]
# name = "Telegram"
# link = "https://t.me/biosthinking"
# [[params.socials]]
# name = "RSS"
# link = "/index.xml"
# [[params.socials]]
# name = "Slides"
# link = "/presentations"
[[params.socials]]
link = "https://mailchi.mp/a1a0d59e7a19/joway"
name = "Subscribe"
[[params.socials]]
link = "/travel"
name = "Travel"
[[params.socials]]
link = "https://joway.io"
name = "About"
# ---------- Optional: Related Posts ----------
# [related]
# includeNewer = true
# threshold = 80
# toLower = false
# [[related.indices]]
# name = "date"
# weight = 100
# [[related.indices]]
# name = "keywords"
# weight = 100
```
看看同类模板
对比同技术栈与用途的模板,找到更适合的视觉与内容结构。

hugo-xmin
eXtremely Minimal Hugo theme: about 140 lines of code in total, including HTML and CSS (with no dependencies)
Hugo · 启动器

hugo-theme-gallery
Gallery Theme for Hugo
Hugo · 启动器

reveal-hugo
📽️ Create rich HTML-based presentations with Hugo and Reveal.js
Hugo · 启动器

anatole
Anatole is a minimalistic two-column theme for Hugo.
Hugo · 启动器

hugo-theme-diary
Moments piled up. A Hugo theme ported from SumiMakito/hexo-theme-Journal.
Hugo · 启动器

risotto
A minimalist, responsive hugo theme inspired by terminal ricing aesthetics.
Hugo · 启动器
