Hugo 主题

上一个/下一个： 所有主题

Blowfish

一个使用 Tailwind CSS 构建的强大而轻量级的 Hugo 主题。

下载
Blowfish

English | 简体中文 | 日本語

Blowfish

Deploy Production to Firebase Deploy Production to GitHub pages Minimum Hugo Version GitHub Blowfish code-size

Blowfish 旨在成为 Hugo 的一个强大而轻量级的主题。它使用 Tailwind CSS 构建，具有简洁和简约的设计，优先考虑您的内容。

blowfish screenshot

🌏 演示站点
📑 主题文档
💎 周边商店
🐛 错误报告和问题
💡 问题和功能请求

Buy Me A Coffee

功能

  • 使用 Tailwind CSS 3.0 构建的完全响应式布局
  • 多种配色方案（或完全自定义您自己的配色方案）
  • 暗黑模式（强制开启/关闭或使用用户切换自动切换）
  • 高度可自定义的配置
  • Firebase 集成以支持动态数据
  • 浏览量计数和点赞机制
  • 相关文章
  • 多种主页布局
  • 多个作者
  • 系列文章
  • 基于日期和权重的文章排序
  • 用于文章阅读的禅宗模式
  • 灵活适应任何内容类型、分类和菜单
  • 页眉和页脚菜单
  • 嵌套菜单和子导航菜单
  • 可滚动的内容表
  • 多语言内容支持，包括对 RTL 语言的支持
  • 能够链接到第三方网站上的帖子
  • 支持多个简码，如画廊、时间线、GitHub 卡片和轮播
  • Buymeacoffee 集成
  • 由 Fuse.js 提供支持的客户端站点搜索
  • 使用 Mermaid 的图表和可视化
  • 使用 Chart.js 的图表
  • TypeIt 集成
  • 具有性能改进的 Youtube 嵌入
  • 使用 KaTeX 的数学符号
  • 来自 FontAwesome 6 的 SVG 图标
  • 使用 Hugo Pipes 自动调整图像大小
  • 标题锚点、目录、代码复制、按钮、徽章等
  • 文章中支持 HTML 和 Emoji 🎉
  • 对 SEO 友好，带有用于共享到社交媒体的链接
  • Fathom Analytics 和 Google Analytics 支持
  • RSS 订阅、Favicons 和评论支持
  • 使用简单的 Tailwind 颜色定义和样式进行高级自定义
  • 针对性能和可访问性进行了优化，具有完美的 Lighthouse 分数
  • 提供完整的文档，并定期更新

blowfish logo

文档

Blowfish 具有涵盖主题所有方面的广泛文档。请务必阅读文档以了解有关如何使用该主题及其功能的更多信息。

安装

Blowfish 支持多种安装方法 - 作为 git 子模块、Hugo 模块或完全手动安装。

每种方法的详细说明可以在安装文档中找到。您应该查阅文档以获得最简单的设置体验。如果您正在使用 git，或者如果您已经有安装 Hugo 主题的经验，那么下面是使用子模块的快速入门指南。

使用 Blowfish 工具快速入门

注意：在继续操作之前，请确保您已安装 Node.js、Git、Go 和 Hugo，并且您已创建新的 Hugo 项目。

我们刚刚发布了一个新的 CLI 工具，可以帮助您开始使用 Blowfish。它将创建一个新的 Hugo 项目，安装主题并为您设置主题配置文件。它仍处于测试阶段，因此请报告您发现的任何问题。

使用 npm（或其他软件包管理器）全局安装 CLI 工具

npm i -g blowfish-tools

然后运行命令 blowfish-tools 以启动交互式运行，该运行将指导您完成创建和配置用例。

blowfish-tools

您还可以运行命令 blowfish-tools new 以一步创建一个新的 Hugo 项目并安装主题。请查看 CLI 帮助以获取更多信息。

blowfish-tools new mynewsite

使用 git 子模块快速入门

注意：在继续操作之前，请确保您已安装 Git、Go 和 Hugo，并且您已创建新的 Hugo 项目。

  1. 从您的项目目录中，初始化 git

    git init

  2. 将 Blowfish 配置为 git 子模块

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

  3. 在您网站的根文件夹中，删除 Hugo 生成的 config.toml 文件。将 *.toml 配置文件从主题复制到您的 config/_default/ 文件夹中。

    您将在 Hugo 缓存目录中找到这些主题配置文件，或从 GitHub 下载副本。

  4. 按照入门说明配置您的网站。

使用 Hugo 快速入门

注意：在继续操作之前，请确保您已安装 Go 和 Hugo，并且您已创建新的 Hugo 项目。

  1. 从您的项目目录中，初始化 Hugo 模块

    hugo mod init github.com/<username>/<repo-name>

  2. 创建 config/_default/module.toml 并添加以下内容

    [[imports]]
path = "github.com/nunocoracao/blowfish/v2"

  3. 使用 hugo server 启动您的服务器，主题将自动下载。

  4. 在您网站的根文件夹中，删除 Hugo 生成的 hugo.toml 文件。将 *.toml 配置文件从主题复制到您的 config/_default/ 文件夹中。

    注意：不要覆盖您上面创建的 module.toml 文件！

    您将在 Hugo 缓存目录中找到这些主题配置文件，或从 GitHub 下载副本。

  5. 按照入门说明配置您的网站。

安装主题更新

发布新版本后，您可以使用 Hugo 更新主题。只需从您的项目目录运行 hugo mod get -u，主题将自动更新到最新版本。

详细的更新说明可在文档中找到。

贡献

预计 Blowfish 会随着时间的推移而发展。我打算根据需要不断添加功能和进行更改。

如果您有任何问题或希望看到的新功能建议，请随时与我联系。

  • 🐛 Bug 报告 & 问题： 使用 GitHub Issues
  • 💡 新功能想法： 在 GitHub Discussions 上发起讨论
  • 🙋‍♀️ 一般问题： 前往 GitHub Discussions

如果您能够修复错误或实现新功能，我欢迎为此目的提交 PR。请在贡献指南中了解更多信息。

随着时间的推移增加的 Star 数

Stargazers over time

Mastodon

另请参阅