drowl87/hextra_mirror
1
0
Fork 1
mirror of https://github.com/imfing/hextra.git synced 2025-08-23 21:26:35 -04:00
Code Issues Actions Packages Projects Releases Wiki Activity

chore: update zh-cn translation

Browse Source
This commit is contained in:
Xin
2025-08-14 19:07:25 +08:00
parent 8773081fae
commit f79b1d262c
29 changed files with 993 additions and 495 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
exampleSite/content/docs/advanced/_index.zh-cn.md
View File

@@ -5,12 +5,12 @@ prev: /docs/guide/shortcodes/tabs
next: /docs/advanced/multi-language
---
本节涵盖了一些主题的高级内容。
本节涵盖该主题的一些高级内容。
<!--more-->
{{< cards >}}
{{< card link="multi-language" title="多语言" icon="translate" >}}
{{< card link="customization" title="自定义" icon="pencil" >}}
{{< card link="multi-language" title="多语言支持" icon="translate" >}}
{{< card link="customization" title="自定义配置" icon="pencil" >}}
{{< card link="comments" title="评论系统" icon="chat-alt" >}}
{{< /cards >}}

4
exampleSite/content/docs/advanced/comments.zh-cn.md
View File

@@ -10,7 +10,7 @@ Hextra 支持为您的网站添加评论系统。
## giscus
[giscus](https://giscus.app/) 是一个由 [GitHub Discussions](https://docs.github.com/en/discussions) 提供支持的评论系统。它是免费且开源的。
[giscus](https://giscus.app/) 是一个由 [GitHub Discussions](https://docs.github.com/en/discussions) 驱动的评论系统。它是免费且开源的。
要启用 giscus，您需要在网站配置文件中添加以下内容：
@@ -27,7 +27,7 @@ params:
categoryId: <分类 ID>
```
giscus 的配置可以从 [giscus.app](https://giscus.app/) 网站生成。更多详细信息也可以在那里找到。
giscus 的配置可以从 [giscus.app](https://giscus.app/) 网站生成。更多详情也可以在那里找到。
可以在页面的 front matter 中为特定页面启用或禁用评论：

118
exampleSite/content/docs/advanced/customization.zh-cn.md
View File

@@ -3,18 +3,18 @@ title: 自定义 Hextra
linkTitle: 自定义
---
Hextra 在 `hugo.yaml` 配置文件中提供了一些默认的自定义选项，用于配置主题。
本页描述了可用的选项以及如何进一步自定义主题。
Hextra 在 `hugo.yaml` 配置文件中提供了一些默认的自定义选项来配置主题。
本页描述了可用选项以及如何进一步自定义主题。
<!--more-->
## 自定义 CSS
要添加自定义 CSS，我们需要在站点中创建一个文件 `assets/css/custom.css`。Hextra 会自动加载此文件。
要添加自定义 CSS，我们需要在站点中创建 `assets/css/custom.css` 文件。Hextra 会自动加载此文件。
### 字体
### 字体家族
内容的字体可以通过以下方式自定义：
可以使用以下方式自定义内容的字体家族：
```css {filename="assets/css/custom.css"}
.content {
@@ -22,9 +22,9 @@ Hextra 在 `hugo.yaml` 配置文件中提供了一些默认的自定义选项，
}
```
### 内联代码元素
### 行内代码元素
与 `其他文本` 混合的文本颜色可以通过以下方式自定义：
与 `其他文本` 混合的代码文本颜色可以通过以下方式自定义：
```css {filename="assets/css/custom.css"}
.content code:not(.code-block code) {
@@ -34,7 +34,7 @@ Hextra 在 `hugo.yaml` 配置文件中提供了一些默认的自定义选项，
### 主色调
主题的主色调可以通过设置 `--primary-hue`、`--primary-saturation` 和 `--primary-lightness` 变量来自定义：
可以通过设置 `--primary-hue`、`--primary-saturation` 和 `--primary-lightness` 变量来自定义主题的主色调：
```css {filename="assets/css/custom.css"}
:root {
@@ -44,9 +44,42 @@ Hextra 在 `hugo.yaml` 配置文件中提供了一些默认的自定义选项，
}
```
### 进一步的主题自定义
### 组件布局变量
可以通过覆盖暴露的 CSS 类来进一步自定义主题。以下是一个自定义页脚元素的示例：
Hextra 提供了 CSS 变量来自定义页面、导航栏和页脚的宽度：
```css {filename="assets/css/custom.css"}
:root {
/* 页面宽度 - 也可以通过 hugo.yaml 中的 params.page.width 配置 */
--hextra-max-page-width: 80rem; /* 默认值：80rem（普通），90rem（宽版），100%（全宽） */
/* 导航栏宽度 - 也可以通过 hugo.yaml 中的 params.navbar.width 配置 */
--hextra-max-navbar-width: 90rem; /* 独立的导航栏宽度 */
/* 页脚宽度 - 也可以通过 hugo.yaml 中的 params.footer.width 配置 */
--hextra-max-footer-width: 80rem; /* 独立的页脚宽度 */
}
```
### Tailwind 主题变量
从基于 Tailwind CSS v4 的 Hextra v0.10.0 开始，您可以通过在 `@layer theme` 块中覆盖 CSS 变量来自定义主题。
这样可以在不修改每个单独类的情况下自定义全局外观。
```css {filename="assets/css/custom.css"}
@layer theme {
:root {
--hx-default-mono-font-family: "JetBrains Mono", monospace;
}
}
```
详情请参阅 [Tailwind 主题变量文档](https://tailwindcss.com/docs/theme#default-theme-variable-reference)。
### 进一步主题自定义
可以通过覆盖暴露的 CSS 类来自定义主题的默认样式。以下是一个自定义页脚元素的示例：
```css {filename="assets/css/custom.css"}
.hextra-footer {
@@ -54,7 +87,7 @@ Hextra 在 `hugo.yaml` 配置文件中提供了一些默认的自定义选项，
}
.hextra-footer:is(html[class~="dark"] *) {
/* 样式将应用于暗模式下的页脚元素 */
/* 样式将应用于暗黑模式下的页脚元素 */
}
```
@@ -82,11 +115,11 @@ Hextra 在 `hugo.yaml` 配置文件中提供了一些默认的自定义选项，
- `hextra-cards` - 卡片网格容器
##### Jupyter Notebook
##### Jupyter 笔记本
- `hextra-jupyter-code-cell` - Jupyter 代码单元容器
- `hextra-jupyter-code-cell-outputs-container` - Jupyter 代码单元输出容器
- `hextra-jupyter-code-cell-outputs` - Jupyter 代码单元输出 div 元素
- `hextra-jupyter-code-cell` - Jupyter 代码单元格容器
- `hextra-jupyter-code-cell-outputs-container` - Jupyter 代码单元格输出容器
- `hextra-jupyter-code-cell-outputs` - Jupyter 代码单元格输出 div 元素
##### PDF
@@ -94,7 +127,7 @@ Hextra 在 `hugo.yaml` 配置文件中提供了一些默认的自定义选项，
##### 步骤
- `steps` - 步骤容器
- `hextra-steps` - 步骤容器
##### 标签页
@@ -111,9 +144,9 @@ Hextra 在 `hugo.yaml` 配置文件中提供了一些默认的自定义选项，
#### 导航栏
- `nav-container` - 导航栏容器
- `nav-container-blur` - 导航栏模糊元素
- `hamburger-menu` - 汉堡菜单按钮
- `hextra-nav-container` - 导航栏容器
- `hextra-nav-container-blur` - 导航栏模糊效果容器
- `hextra-hamburger-menu` - 汉堡菜单按钮
#### 页脚
@@ -122,9 +155,18 @@ Hextra 在 `hugo.yaml` 配置文件中提供了一些默认的自定义选项，
#### 搜索
- `search-wrapper` - 搜索包装容器
- `search-input` - 搜索输入元素
- `search-results` - 搜索结果列表容器
- `hextra-search-wrapper` - 搜索包装容器
- `hextra-search-input` - 搜索输入元素
- `hextra-search-results` - 搜索结果列表容器
搜索 UI 中使用的可选嵌套类：
- `hextra-search-title` - 结果标题元素
- `hextra-search-active` - 活动结果锚点
- `hextra-search-no-result` - 空状态元素
- `hextra-search-prefix` - 分组结果的面包屑/前缀标签
- `hextra-search-excerpt` - 结果片段文本
- `hextra-search-match` - 高亮查询范围
#### 目录
@@ -132,27 +174,29 @@ Hextra 在 `hugo.yaml` 配置文件中提供了一些默认的自定义选项，
#### 侧边栏
- `mobile-menu-overlay` - 移动菜单的覆盖元素
- `sidebar-container` - 侧边栏容器
- `sidebar-active-item` - 侧边栏中的活动项
- `hextra-sidebar-container` - 侧边栏容器
- `hextra-sidebar-active-item` - 侧边栏中的活动项
#### 语言切换器
- `language-switcher` - 语言切换按钮
- `language-options` - 语言选项容器
- `hextra-language-switcher` - 语言切换按钮
- `hextra-language-options` - 语言选项容器
#### 主题切换
- `theme-toggle` - 主题切换按钮
- `hextra-theme-toggle` - 主题切换按钮
#### 代码复制按钮
- `hextra-code-copy-btn-container` - 代码复制按钮容器
- `hextra-code-copy-btn` - 代码复制按钮
- `hextra-copy-icon` - 复制图标元素
- `hextra-success-icon` - 成功图标元素
#### 代码块
- `hextra-code-block` - 代码块容器
- `hextra-code-filename` - 代码块的文件名元素
#### 功能卡片
@@ -162,10 +206,6 @@ Hextra 在 `hugo.yaml` 配置文件中提供了一些默认的自定义选项，
- `hextra-feature-grid` - 功能网格容器
#### 面包屑导航
面包屑导航没有特定的类。
### 语法高亮
可用的语法高亮主题列表可在 [Chroma 样式库](https://xyproto.github.io/splash/docs/all.html) 中找到。可以使用以下命令生成样式表：
@@ -178,7 +218,7 @@ hugo gen chromastyles --style=github
## 自定义脚本
你可以通过添加以下文件在每个页面的 head 末尾添加自定义脚本：
您可以通过添加以下文件在每个页面的 head 末尾添加自定义脚本：
```
layouts/partials/custom/head-end.html
@@ -186,26 +226,26 @@ layouts/partials/custom/head-end.html
## 自定义页脚额外部分
你可以通过在站点中创建文件 `layouts/partials/custom/footer.html` 来在页脚中添加额外部分。
您可以通过在站点中创建 `layouts/partials/custom/footer.html` 文件来添加页脚的额外部分。
```html {filename="layouts/partials/custom/footer.html"}
<!-- 你的页脚元素在这里 -->
<!-- 您的页脚元素放在这里 -->
```
添加的部分将出现在页脚的版权部分之前。
你可以使用 [HTML](https://developer.mozilla.org/en-US/docs/Web/HTML) 和 [Hugo 模板语法](https://gohugo.io/templates/) 来添加自己的内容。
您可以使用 [HTML](https://developer.mozilla.org/en-US/docs/Web/HTML) 和 [Hugo 模板语法](https://gohugo.io/templates/) 添加自己的内容。
页脚部分可用的 Hugo 变量有：`.switchesVisible` 和 `.copyrightVisible`。
页脚部分可用的 Hugo 变量有：`.switchesVisible` 和 `.displayCopyright`。
## 自定义布局
可以通过在站点的 `layouts` 目录中创建同名文件来覆盖主题的布局。
例如，要覆盖文档的 `single.html` 布局，可以在站点中创建文件 `layouts/docs/single.html`。
例如，要覆盖文档的 `single.html` 布局，可以在站点中创建 `layouts/docs/single.html` 文件。
更多信息，请参阅 [Hugo 模板文档][hugo-template-docs]。
## 进一步自定义
没有找到你想要的？欢迎 [发起讨论](https://github.com/imfing/hextra/discussions) 或为主题做出贡献！
没有找到您需要的内容？欢迎 [发起讨论](https://github.com/imfing/hextra/discussions) 或为主题做出贡献！
[hugo-template-docs]: https://gohugo.io/templates/

16
exampleSite/content/docs/advanced/multi-language.zh-cn.md
View File

@@ -8,9 +8,9 @@ Hextra 支持使用 Hugo 的[多语言模式](https://gohugo.io/content-manageme
<!--more-->
## 启用多语言
## 启用多语言功能
要使我们的网站支持多语言，我们需要告诉 Hugo 支持的语言。我们需要在站点配置文件中添加：
要使网站支持多语言，我们需要在站点配置文件中指定支持的语言：
```yaml {filename="hugo.yaml"}
defaultContentLanguage: en
@@ -28,7 +28,7 @@ languages:
## 通过文件名管理翻译
Hugo 支持通过文件名管理翻译。例如，如果我们有一个英文文件 `content/docs/_index.md`，我们可以创建一个文件 `content/docs/_index.fr.md` 作为法语翻译。
Hugo 支持通过文件名管理翻译。例如，如果我们有一个英文文件 `content/docs/_index.md`，可以创建 `content/docs/_index.fr.md` 作为法语翻译。
{{< filetree/container >}}
{{< filetree/folder name="content" >}}
@@ -40,11 +40,11 @@ Hugo 支持通过文件名管理翻译。例如，如果我们有一个英文文
{{< /filetree/folder >}}
{{< /filetree/container >}}
注意：Hugo 还支持[通过内容目录进行翻译](https://gohugo.io/content-management/multilingual/#translation-by-content-directory)。
注意：Hugo 还支持[通过内容目录翻译](https://gohugo.io/content-management/multilingual/#translation-by-content-directory)。
## 翻译菜单项
要翻译导航栏中的菜单项，我们需要设置 `identifier` 字段：
要翻译导航栏中的菜单项，需要设置 `identifier` 字段：
```yaml {filename="hugo.yaml"}
menu:
@@ -59,7 +59,7 @@ menu:
weight: 2
```
并在相应的 i18n 文件中进行翻译：
并在对应的 i18n 文件中进行翻译：
```yaml {filename="i18n/fr.yaml"}
documentation: Documentation
@@ -68,7 +68,7 @@ blog: Blog
## 翻译字符串
要翻译其他地方的字符串，我们需要将翻译添加到相应的 i18n 文件中：
要翻译其他位置的字符串，需要将翻译添加到对应的 i18n 文件中：
```yaml {filename="i18n/fr.yaml"}
readMore: Lire la suite
@@ -76,7 +76,7 @@ readMore: Lire la suite
主题中使用的字符串列表可以在 `i18n/en.yaml` 文件中找到。
## 了解更多
## 延伸阅读
- [Hugo 多语言模式](https://gohugo.io/content-management/multilingual/)
- [Hugo 多语言第一部分：内容翻译](https://www.regisphilibert.com/blog/2018/08/hugo-multilingual-part-1-managing-content-translation/)