forked from drowl87/hextra_mirror
docs: update zh-cn translation (#365)
This commit is contained in:
纳兰音韵
GitHub
parent
f98fa8c389
commit
81720c7727
163
exampleSite/content/docs/guide/deploy-site.zh.cn.md
Normal file
163
exampleSite/content/docs/guide/deploy-site.zh.cn.md
Normal file
@ -0,0 +1,163 @@
|
||||
---
|
||||
title: Deploy Site
|
||||
prev: /docs/guide/shortcodes
|
||||
next: /docs/advanced
|
||||
---
|
||||
Hugo 生成静态站点，允许多种托管方式，你可以自由选择
|
||||
本页将给出部署你的 Hextra 站点的方法
|
||||
|
||||
<!--more-->
|
||||
|
||||
|
||||
## GitHub Pages
|
||||
|
||||
[GitHub Pages](https://docs.github.com/pages) 是免费部署和托管网站的推荐方法
|
||||
|
||||
如果您使用以下方式引导该网站 [hextra-starter-template](https://github.com/imfing/hextra-starter-template), 它提供了开箱即用的 GitHub Actions 工作流程，有助于自动部署到 GitHub Pages
|
||||
|
||||
{{% details title="GitHub Actions Configuration" closed="true" %}}
|
||||
|
||||
以下是配置来自 [hextra-starter-template](https://github.com/imfing/hextra-starter-template) 的 Workflow 的示例：
|
||||
|
||||
```yaml {filename=".github/workflows/pages.yaml"}
|
||||
# 用于构建 Hugo 站点并将其部署到 GitHub Pages 的示例工作流程
|
||||
name: Deploy Hugo site to Pages
|
||||
|
||||
on:
|
||||
# 由默认分支触发
|
||||
push:
|
||||
branches: ["main"]
|
||||
|
||||
# 允许手动运行
|
||||
workflow_dispatch:
|
||||
|
||||
# 设置 GITHUB_TOKEN 的权限以允许部署到 GitHub Pages
|
||||
permissions:
|
||||
contents: read
|
||||
pages: write
|
||||
id-token: write
|
||||
|
||||
# 仅允许一项并发部署，跳过正在进行的运行和最新排队的运行之间排队的运行
|
||||
# 但是，不要取消正在进行的运行，因为我们希望完成这些生产部署
|
||||
concurrency:
|
||||
group: "pages"
|
||||
cancel-in-progress: false
|
||||
|
||||
# 默认为 bash
|
||||
defaults:
|
||||
run:
|
||||
shell: bash
|
||||
|
||||
jobs:
|
||||
# 开始构建
|
||||
build:
|
||||
runs-on: ubuntu-latest
|
||||
env:
|
||||
HUGO_VERSION: 0.121.2
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v4
|
||||
with:
|
||||
fetch-depth: 0 # 获取 .GitInfo 和 .Lastmod 的所有历史记录
|
||||
submodules: recursive
|
||||
- name: Setup Go
|
||||
uses: actions/setup-go@v5
|
||||
with:
|
||||
go-version: '1.21'
|
||||
- name: Setup Pages
|
||||
id: pages
|
||||
uses: actions/configure-pages@v4
|
||||
- name: Setup Hugo
|
||||
run: |
|
||||
wget -O ${{ runner.temp }}/hugo.deb https://github.com/gohugoio/hugo/releases/download/v${HUGO_VERSION}/hugo_extended_${HUGO_VERSION}_linux-amd64.deb \
|
||||
&& sudo dpkg -i ${{ runner.temp }}/hugo.deb
|
||||
- name: Build with Hugo
|
||||
env:
|
||||
# 最大程度地向后兼容 Hugo 模块
|
||||
HUGO_ENVIRONMENT: production
|
||||
HUGO_ENV: production
|
||||
run: |
|
||||
hugo \
|
||||
--gc --minify \
|
||||
--baseURL "${{ steps.pages.outputs.base_url }}/"
|
||||
- name: Upload artifact
|
||||
uses: actions/upload-pages-artifact@v3
|
||||
with:
|
||||
path: ./public
|
||||
|
||||
# 开始部署
|
||||
deploy:
|
||||
environment:
|
||||
name: github-pages
|
||||
url: ${{ steps.deployment.outputs.page_url }}
|
||||
runs-on: ubuntu-latest
|
||||
needs: build
|
||||
steps:
|
||||
- name: Deploy to GitHub Pages
|
||||
id: deployment
|
||||
uses: actions/deploy-pages@v4
|
||||
```
|
||||
|
||||
{{% /details %}}
|
||||
|
||||
|
||||
{{< callout >}}
|
||||
在仓库设置中将 **Pages** > **Build and deployment** > **Source** 调整为 **GitHub Actions**:
|
||||
|
||||
{{< /callout >}}
|
||||
|
||||
默认情况下，上述 GitHub Actions 工作流程 `.github/workflows/pages.yaml` 假定站点部署到 `https://<USERNAME>.github.io/<REPO>/`
|
||||
|
||||
如需部署到 `https://<USERNAME>.github.io/` 修改参数 `--baseURL`:
|
||||
|
||||
```yaml {filename=".github/workflows/pages.yaml",linenos=table,linenostart=54,hl_lines=[4]}
|
||||
run: |
|
||||
hugo \
|
||||
--gc --minify \
|
||||
--baseURL "https://${{ github.repository_owner }}.github.io/"
|
||||
```
|
||||
|
||||
如需部署到自己的域，请对应修改 `--baseURL`
|
||||
|
||||
|
||||
## Cloudflare Pages
|
||||
|
||||
1. 将您的网站托管在 Git 存储库（例如 GitHub）
|
||||
2. 登录到 [Cloudflare dashboard](https://dash.cloudflare.com/) 并选择你的账户
|
||||
3. 转至在账户主页面中 **Workers & Pages** > **Create application** > **Pages** > **Connect to Git**
|
||||
4. 选择你的仓库 **Set up builds and deployments** 提供以下信息：
|
||||
|
||||
| Configuration | Value |
|
||||
| ----------------- | -------------------- |
|
||||
| Production branch | `main` |
|
||||
| Build command | `hugo --gc --minify` |
|
||||
| Build directory | `public` |
|
||||
|
||||
如需了解更多内容，见：
|
||||
- [Deploy a Hugo site](https://developers.cloudflare.com/pages/framework-guides/deploy-a-hugo-site/#deploy-with-cloudflare-pages).
|
||||
- [Language support and tools](https://developers.cloudflare.com/pages/platform/language-support-and-tools/).
|
||||
|
||||
|
||||
## Netlify
|
||||
|
||||
1. 将代码推送到 Git 存储库 (如 GitHub, GitLab)
|
||||
2. [导入项目](https://app.netlify.com/start)
|
||||
3. 如果您不使用[hextra-starter-template][hextra-starter-template], 手动配置以下内容：
|
||||
- C 将构建命令配置为 `hugo --gc --minify`
|
||||
- 指定发布目录为 `public`
|
||||
- 添加环境变量 `HUGO_VERSION` 并设定为 `0.119.0`
|
||||
4. 部署
|
||||
|
||||
转至 [Hugo on Netlify](https://docs.netlify.com/integrations/frameworks/hugo/) 获得更多信息
|
||||
|
||||
|
||||
## Vercel
|
||||
|
||||
1. 将代码推送到 Git 存储库（GitHub、GitLab 等）
|
||||
2. 转至 [Vercel Dashboard](https://vercel.com/dashboard) 并导入你的 Hugo 项目
|
||||
3. 配置项目，选择 Hugo 作为 Framework Preset
|
||||
4. 覆盖构建命令和安装命令：
|
||||
1. 设置构建命令为 `hugo --gc --minify`
|
||||
2. 将安装命令设置为 `yum install golang`
|
||||
|
||||
|
||||
79
exampleSite/content/docs/guide/shortcodes/callout.zh-cn.md
Normal file
79
exampleSite/content/docs/guide/shortcodes/callout.zh-cn.md
Normal file
@ -0,0 +1,79 @@
|
||||
---
|
||||
title: 标注
|
||||
linkTitle: Callout
|
||||
aliases:
|
||||
- callouts
|
||||
prev: /docs/guide/shortcodes
|
||||
---
|
||||
|
||||
向读者显示重要信息的内置组件。
|
||||
|
||||
<!--more-->
|
||||
|
||||
## Example
|
||||
|
||||
{{< callout emoji="👾">}}
|
||||
**标注**是一段旨在吸引注意力的短文本
|
||||
{{< /callout >}}
|
||||
|
||||
{{< callout type="info" >}}
|
||||
**标注**是一段旨在吸引注意力的短文本。
|
||||
{{< /callout >}}
|
||||
|
||||
{{< callout type="warning" >}}
|
||||
**标注**是一段旨在吸引注意力的短文本。
|
||||
{{< /callout >}}
|
||||
|
||||
{{< callout type="error" >}}
|
||||
**标注**是一段旨在吸引注意力的短文本。
|
||||
{{< /callout >}}
|
||||
|
||||
## Usage
|
||||
|
||||
### Default
|
||||
|
||||
{{< callout emoji="🌐">}}
|
||||
Hugo 可用于创建各种网站，包括博客、作品集、文档网站等
|
||||
{{< /callout >}}
|
||||
|
||||
```markdown
|
||||
{{</* callout emoji="🌐" */>}}
|
||||
Hugo 可用于创建各种网站，包括博客、作品集、文档网站等
|
||||
{{</* /callout */>}}
|
||||
```
|
||||
|
||||
### Info
|
||||
|
||||
{{< callout type="info" >}}
|
||||
请访问 GitHub 查看最新版本
|
||||
{{< /callout >}}
|
||||
|
||||
```markdown
|
||||
{{</* callout type="info" */>}}
|
||||
请访问 GitHub 查看最新版本
|
||||
{{</* /callout */>}}
|
||||
```
|
||||
|
||||
### Warning
|
||||
|
||||
{{< callout type="warning" >}}
|
||||
该 API 将在下一版本中弃用
|
||||
{{< /callout >}}
|
||||
|
||||
```markdown
|
||||
{{</* callout type="warning" */>}}
|
||||
**标注**是一段旨在吸引注意力的简短文字
|
||||
{{</* /callout */>}}
|
||||
```
|
||||
|
||||
### Error
|
||||
|
||||
{{< callout type="error" >}}
|
||||
出问题了，要爆炸了
|
||||
{{< /callout >}}
|
||||
|
||||
```markdown
|
||||
{{</* callout type="error" */>}}
|
||||
出问题了，要爆炸了
|
||||
{{</* /callout */>}}
|
||||
```
|
||||
65
exampleSite/content/docs/guide/shortcodes/cards.zh-cn.md.md
Normal file
65
exampleSite/content/docs/guide/shortcodes/cards.zh-cn.md.md
Normal file
@ -0,0 +1,65 @@
|
||||
---
|
||||
title: 卡片
|
||||
linkTitle: Cards
|
||||
---
|
||||
|
||||
## 示例
|
||||
|
||||
{{< cards >}}
|
||||
{{< card link="../callout" title="Callout" icon="warning" >}}
|
||||
{{< card link="/" title="No Icon" >}}
|
||||
{{< /cards >}}
|
||||
|
||||
{{< cards >}}
|
||||
{{< card link="/" title="Image Card" image="https://source.unsplash.com/featured/800x600?landscape" subtitle="Unsplash Landscape" >}}
|
||||
{{< card link="/" title="Local Image" image="/images/card-image-unprocessed.jpg" subtitle="Raw image under static directory." >}}
|
||||
{{< card link="/" title="Local Image" image="images/space.jpg" subtitle="Image under assets directory, processed by Hugo." method="Resize" options="600x q80 webp" >}}
|
||||
{{< /cards >}}
|
||||
|
||||
## 使用
|
||||
|
||||
```
|
||||
{{</* cards */>}}
|
||||
{{</* card link="../callout" title="Callout" icon="warning" */>}}
|
||||
{{</* card link="/" title="No Icon" */>}}
|
||||
{{</* /cards */>}}
|
||||
```
|
||||
|
||||
```
|
||||
{{</* cards */>}}
|
||||
{{</* card link="/" title="Image Card" image="https://source.unsplash.com/featured/800x600?landscape" subtitle="Unsplash Landscape" */>}}
|
||||
{{</* card link="/" title="Local Image" image="/images/card-image-unprocessed.jpg" subtitle="Raw image under static directory." */>}}
|
||||
{{</* card link="/" title="Local Image" image="images/space.jpg" subtitle="Image under assets directory, processed by Hugo." method="Resize" options="600x q80 webp" */>}}
|
||||
{{</* /cards */>}}
|
||||
```
|
||||
|
||||
## 卡片参数
|
||||
|
||||
| Parameter | Description |
|
||||
|----------- |---------------------------------------|
|
||||
| `link` | URL（内部或外部） |
|
||||
| `title` | 卡片的标题 |
|
||||
| `subtitle` | 字幕标题（支持 Markdown） |
|
||||
| `icon` | 图标的名称 |
|
||||
|
||||
## Image Card
|
||||
|
||||
此外，该卡还支持通过以下参数添加图像和处理：
|
||||
|
||||
| Parameter | Description |
|
||||
|----------- |---------------------------------------------|
|
||||
| `image` | 指定卡片的图像 URL. |
|
||||
| `method` | 设置 Hugo 的图像处理方法。 |
|
||||
| `options` | 配置 Hugo 的图像处理选项。|
|
||||
|
||||
卡片支持三种图像：
|
||||
|
||||
1. 远程图片：完整网址应放置在 image 参数中
|
||||
2. 静态图片：使用 Hugo 的 static/ 目录中的相对路径
|
||||
3. 处理过的图片：使用 Hugo 的 assets/ 目录中的相对路径
|
||||
|
||||
Hextra 在构建过程中会自动检测图片是否需要处理，并根据需要应用 options 参数或默认设置（缩放，800x，质量 80，WebP 格式）。
|
||||
|
||||
它目前支持以下处理方法：Resize（缩放）、Fit（适应）、Fill（填充）和 Crop（裁剪）。
|
||||
|
||||
有关 Hugo 内置图像处理命令、方法和选项的更多信息，请参阅他们的 [Image Processing Documentation](https://gohugo.io/content-management/image-processing/).
|
||||
43
exampleSite/content/docs/guide/shortcodes/details.zh-cn.md
Normal file
43
exampleSite/content/docs/guide/shortcodes/details.zh-cn.md
Normal file
@ -0,0 +1,43 @@
|
||||
---
|
||||
title: 详情
|
||||
---
|
||||
|
||||
用于显示可折叠内容的内置组件。
|
||||
|
||||
<!--more-->
|
||||
|
||||
## 示例
|
||||
|
||||
{{% details title="Details" %}}
|
||||
|
||||
这是细节的内容
|
||||
|
||||
Markdown is **supported**.
|
||||
|
||||
{{% /details %}}
|
||||
|
||||
{{% details title="Click me to reveal" closed="true" %}}
|
||||
|
||||
默认情况下这将被隐藏
|
||||
|
||||
{{% /details %}}
|
||||
|
||||
## Usage
|
||||
|
||||
````markdown
|
||||
{{%/* details title="Details" */%}}
|
||||
|
||||
这是细节的内容
|
||||
|
||||
**支持** Markdown
|
||||
|
||||
{{%/* /details */%}}
|
||||
````
|
||||
|
||||
````markdown
|
||||
{{%/* details title="Click me to reveal" closed="true" */%}}
|
||||
|
||||
默认情况下这将被隐藏
|
||||
|
||||
{{%/* /details */%}}
|
||||
````
|
||||
34
exampleSite/content/docs/guide/shortcodes/filetree.zh-cn.md
Normal file
34
exampleSite/content/docs/guide/shortcodes/filetree.zh-cn.md
Normal file
@ -0,0 +1,34 @@
|
||||
---
|
||||
title: 文件树
|
||||
linkTitle: FileTree
|
||||
---
|
||||
|
||||
## 示例
|
||||
|
||||
{{< filetree/container >}}
|
||||
{{< filetree/folder name="content" >}}
|
||||
{{< filetree/file name="_index.md" >}}
|
||||
{{< filetree/folder name="docs" state="closed" >}}
|
||||
{{< filetree/file name="_index.md" >}}
|
||||
{{< filetree/file name="introduction.md" >}}
|
||||
{{< filetree/file name="introduction.fr.md" >}}
|
||||
{{< /filetree/folder >}}
|
||||
{{< /filetree/folder >}}
|
||||
{{< filetree/file name="hugo.toml" >}}
|
||||
{{< /filetree/container >}}
|
||||
|
||||
## 用法
|
||||
|
||||
```text {filename="Markdown"}
|
||||
{{</* filetree/container */>}}
|
||||
{{</* filetree/folder name="content" */>}}
|
||||
{{</* filetree/file name="_index.md" */>}}
|
||||
{{</* filetree/folder name="docs" state="closed" */>}}
|
||||
{{</* filetree/file name="_index.md" */>}}
|
||||
{{</* filetree/file name="introduction.md" */>}}
|
||||
{{</* filetree/file name="introduction.fr.md" */>}}
|
||||
{{</* /filetree/folder */>}}
|
||||
{{</* /filetree/folder */>}}
|
||||
{{</* filetree/file name="hugo.toml" */>}}
|
||||
{{</* /filetree/container */>}}
|
||||
```
|
||||
46
exampleSite/content/docs/guide/shortcodes/icon.zh-cn.md
Normal file
46
exampleSite/content/docs/guide/shortcodes/icon.zh-cn.md
Normal file
@ -0,0 +1,46 @@
|
||||
---
|
||||
title: 图标
|
||||
---
|
||||
|
||||
要内联使用此短代码，需要在配置中启用内联短代码：
|
||||
|
||||
```yaml {filename="hugo.yaml"}
|
||||
enableInlineShortcodes: true
|
||||
```
|
||||
|
||||
可用图标列表可以在以下位置找到 [`data/icons.yaml`](https://github.com/imfing/hextra/blob/main/data/icons.yaml).
|
||||
|
||||
<!--more-->
|
||||
|
||||
## 示例
|
||||
|
||||
{{< icon "academic-cap" >}}
|
||||
{{< icon "cake" >}}
|
||||
{{< icon "gift" >}}
|
||||
{{< icon "sparkles" >}}
|
||||
|
||||
## 用法
|
||||
|
||||
```
|
||||
{{</* icon "github" */>}}
|
||||
```
|
||||
|
||||
[Heroicons](https://v1.heroicons.com/) v1 轮廓图标开箱即用
|
||||
|
||||
### 如何添加自己的图标
|
||||
|
||||
创建 `data/icons.yaml` 文件，然后按以下格式添加您自己的 SVG 图标：
|
||||
|
||||
```yaml {filename="data/icons.yaml"}
|
||||
your-icon: <svg>your icon svg content</svg>
|
||||
```
|
||||
|
||||
然后可以在短代码中使用它，如下所示：
|
||||
|
||||
```
|
||||
{{</* icon "your-icon" */>}}
|
||||
|
||||
{{</* card icon="your-icon" */>}}
|
||||
```
|
||||
|
||||
提示：[Iconify Design](https://iconify.design/) 是为您的网站查找 SVG 图标的好地方
|
||||
42
exampleSite/content/docs/guide/shortcodes/steps.zh-cn.md
Normal file
42
exampleSite/content/docs/guide/shortcodes/steps.zh-cn.md
Normal file
@ -0,0 +1,42 @@
|
||||
---
|
||||
title: 步骤
|
||||
---
|
||||
|
||||
A built-in component to display a series of steps.
|
||||
|
||||
## 示例
|
||||
|
||||
{{% steps %}}
|
||||
|
||||
### 第一步
|
||||
|
||||
这是第一步。
|
||||
|
||||
### 第二步
|
||||
|
||||
这是第二步。
|
||||
|
||||
### 第三步
|
||||
|
||||
这是第三步。
|
||||
|
||||
{{% /steps %}}
|
||||
|
||||
|
||||
## 使用
|
||||
|
||||
将 Markdown h3 标题放入 `steps` 短代码中。
|
||||
|
||||
```
|
||||
{{%/* steps */%}}
|
||||
|
||||
### Step 1
|
||||
|
||||
This is the first step.
|
||||
|
||||
### Step 2
|
||||
|
||||
This is the second step.
|
||||
|
||||
{{%/* /steps */%}}
|
||||
```
|
||||
93
exampleSite/content/docs/guide/shortcodes/tabs.zh-cn.md
Normal file
93
exampleSite/content/docs/guide/shortcodes/tabs.zh-cn.md
Normal file
@ -0,0 +1,93 @@
|
||||
---
|
||||
title: Tabs
|
||||
next: /docs/guide/deploy-site
|
||||
---
|
||||
|
||||
## 示例
|
||||
|
||||
{{< tabs items="JSON,YAML,TOML" >}}
|
||||
|
||||
{{< tab >}}**JSON**: JavaScript Object Notation (JSON) is a standard text-based format for representing structured data based on JavaScript object syntax.{{< /tab >}}
|
||||
{{< tab >}}**YAML**: YAML is a human-readable data serialization language.{{< /tab >}}
|
||||
{{< tab >}}**TOML**: TOML aims to be a minimal configuration file format that's easy to read due to obvious semantics.{{< /tab >}}
|
||||
|
||||
{{< /tabs >}}
|
||||
|
||||
## 使用
|
||||
|
||||
### 默认情况下
|
||||
|
||||
```
|
||||
{{</* tabs items="JSON,YAML,TOML" */>}}
|
||||
|
||||
{{</* tab */>}}**JSON**: JavaScript Object Notation (JSON) is a standard text-based format for representing structured data based on JavaScript object syntax.{{</* /tab */>}}
|
||||
{{</* tab */>}}**YAML**: YAML is a human-readable data serialization language.{{</* /tab */>}}
|
||||
{{</* tab */>}}**TOML**: TOML aims to be a minimal configuration file format that's easy to read due to obvious semantics.{{</* /tab */>}}
|
||||
|
||||
{{</* /tabs */>}}
|
||||
```
|
||||
|
||||
### 指定索引
|
||||
|
||||
使用 `defaultIndex` 属性指定选定的选项卡。索引从 0 开始。
|
||||
|
||||
```
|
||||
{{</* tabs items="JSON,YAML,TOML" defaultIndex="1" */>}}
|
||||
|
||||
{{</* tab */>}}**JSON**: JavaScript Object Notation (JSON) is a standard text-based format for representing structured data based on JavaScript object syntax.{{</* /tab */>}}
|
||||
{{</* tab */>}}**YAML**: YAML is a human-readable data serialization language.{{</* /tab */>}}
|
||||
{{</* tab */>}}**TOML**: TOML aims to be a minimal configuration file format that's easy to read due to obvious semantics.{{</* /tab */>}}
|
||||
|
||||
{{</* /tabs */>}}
|
||||
```
|
||||
|
||||
默认为 `YAML`
|
||||
|
||||
{{< tabs items="JSON,YAML,TOML" defaultIndex="1" >}}
|
||||
|
||||
{{< tab >}}**JSON**: JavaScript Object Notation (JSON) is a standard text-based format for representing structured data based on JavaScript object syntax.{{< /tab >}}
|
||||
{{< tab >}}**YAML**: YAML is a human-readable data serialization language.{{< /tab >}}
|
||||
{{< tab >}}**TOML**: TOML aims to be a minimal configuration file format that's easy to read due to obvious semantics.{{< /tab >}}
|
||||
|
||||
{{< /tabs >}}
|
||||
|
||||
|
||||
### 使用 Markdown
|
||||
|
||||
还支持包括代码块的 Markdown 语法：
|
||||
|
||||
````
|
||||
{{</* tabs items="JSON,YAML,TOML" */>}}
|
||||
|
||||
{{</* tab */>}}
|
||||
```json
|
||||
{ "hello": "world" }
|
||||
```
|
||||
{{</* /tab */>}}
|
||||
|
||||
... add other tabs similarly
|
||||
|
||||
{{</* /tabs */>}}
|
||||
````
|
||||
|
||||
{{< tabs items="JSON,YAML,TOML" >}}
|
||||
|
||||
{{< tab >}}
|
||||
```json
|
||||
{ "hello": "world" }
|
||||
```
|
||||
{{< /tab >}}
|
||||
|
||||
{{< tab >}}
|
||||
```yaml
|
||||
hello: world
|
||||
```
|
||||
{{< /tab >}}
|
||||
|
||||
{{< tab >}}
|
||||
```toml
|
||||
hello = "world"
|
||||
```
|
||||
{{< /tab >}}
|
||||
|
||||
{{< /tabs >}}
|
||||
Loading…
x
Reference in New Issue
Block a user