Hugo 主题

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

简

一个可读的 Hugo 主题

下载
Jane

V3 升级通知

hugo-theme-jane 刚刚进行了一次重大更新，请查看：Jane 主题 V3 重大更新 & Hugo-Theme-Jane V3 升级通知！！！· xianmin/hugo-theme-jane · Discussion #397

jane-preview

hugo-theme-jane

简 是一个可读的 Hugo 主题。有多种颜色方案可供选择，并且易于个性化。自 2018 年以来一直运行良好。

演示 | 中文说明

主要功能

  • 更好的阅读体验
  • 使用 Pico CSS 作为颜色方案，允许主题颜色切换和暗/亮模式切换。
  • 样式设置，位于 /assets/sass/_settings.scss。
  • 响应式且对移动设备友好
  • 支持多语言模式
  • 更好的分页、TOC、脚注行为
  • 使用出色的 Chroma 语法高亮显示
  • 自定义 CSS、自定义 JS、自定义 Head 支持
  • 子菜单支持
  • 搜索优化

本主题的开发理念

  1. 没有 node_modules - 更少的依赖项使维护更容易。
  2. 鼓励用户根据个人喜好修改主题，以获得更个性化的网站。
  3. 阅读体验是首要任务。
  4. 部署一次，专注于写作，不再麻烦。

真实示例

  • crazyoptimist
  • 一座岛

快速开始

注意： 本教程假设您是第一次使用 Hugo。Hugo 是最流行的开源静态站点生成器之一。您可以查看 Hugo 官方文档以获取更多帮助。

1. 安装 Hugo & Dart Sass

从 Hugo 版本下载适合您平台的版本。下载后，二进制文件可以从任何地方运行。理想情况下，您应该将其安装在 PATH 中的某个位置以便于使用。/usr/local/bin 是最可能的位置。

安装 Dart Sass，请参阅官方文档：https://gohugo.com.cn/hugo-pipes/transpile-sass-to-css/#dart-sass 。

2. 创建新站点 

hugo new site myBlog

以上命令将在名为 myBlog 的文件夹中创建一个新的 Hugo 站点。

3. 使用 Hugo-Theme-Jane

将此存储库克隆到 themes 文件夹中

cd myBlog
git clone https://github.com/xianmin/hugo-theme-jane.git --depth=1 themes/jane
或者，安装为模块

如果您安装了 Go，您可以将主题安装为 hugo 模块，这样就不需要将其克隆到 themes 文件夹中

hugo mod init example.com/my-blog

之后，您需要在 config.toml 文件中使用 github.com/xianmin/hugo-theme-jane 作为您的 theme，而不是 hugo-theme-jane。

复制示例站点内容

cp -r themes/jane/exampleSite/content ./

复制默认站点配置

cp themes/jane/exampleSite/hugo.toml ./

查看示例站点

hugo server

打开 https://127.0.0.1:1313/，您将看到您的站点正在运行，其中包含示例内容。

4. 开始写博客

默认配置文件 hugo.toml 位于您的站点根目录中。您可以自定义它以匹配您站点的详细信息。有关配置 Hugo 的文档可以在官方文档中找到

默认内容文件位于 ./content/post 目录中。

5. 生成您的网站

运行 hugo，这会将您的网站生成到默认的 public/ 目录中。

干得好！

如果您有额外的时间或想了解更多关于 Hugo 的信息，请查看出色的 Hugo 官方文档。

站点配置

查看 exampleSite 文件夹。

此目录包含示例配置文件和演示内容。它为您提供了一个示例设置，您可以根据自己的喜好进行配置。

将 hugo.toml 复制到您网站的根目录。如果需要，覆盖现有配置文件。

单篇文章配置

前言：Hugo 允许您在内容文件中添加 yaml、toml 或 json 格式的前言。

YAML 示例

---
# Common-Defined
title: "An Example Post"
date: 2018-01-01T16:01:23+08:00
lastmod: 2018-01-02T16:01:23+08:00
draft: false
tags: ["tag-1", "tag-2", "tag-3"]
categories: ["index"]
author: "xianmin"

# User-Defined
# You can close(false) or open(true) something for this content.
# P.S. comment can only be closed
comment: false
toc: false
# You can also define another contentCopyright
contentCopyright: '<a rel="license noopener" href="https://creativecommons.org/licenses/by-nc-nd/4.0/" target="_blank">CC BY-NC-ND 4.0</a>'
reward: false
mathjax: true
---

多语言（语言）支持

Hugo-Theme-Jane 支持并排创建具有多种语言的网站。

您应该在站点配置的 languages 部分定义可用的语言。

翻译文件从 i18n/ 文件夹中收集。

要使用翻译

# use Chinese translation
defaultContentLanguage = "zh-cn"  # Default language to use (if you set up multilingual support)
[Languages.zh-cn]
  languageCode = "zh-cn"

要使用多语言模式，请参阅 多语言模式 | Hugo 。

贡献

如果您有兴趣修复问题并直接为此主题做出贡献，请参阅 如何贡献 文档。

有很多方式可以为 Jane 主题做出贡献

  • 提交拉取请求
  • 报告问题
  • 提供新的翻译
  • 创建建议
  • 更正不恰当的英语表达（好吧，我的英语不太好）

贡献者

这个项目的存在归功于所有做出贡献的人

许可证

Hugo-theme-jane 使用 MIT 许可证授权。请查看 LICENSE 文件了解详细信息。

另请参阅