From e082a59e71603f8958f31a87c6fac3375ec03849 Mon Sep 17 00:00:00 2001 From: chenrui Date: Fri, 23 Nov 2018 10:17:58 +0800 Subject: [PATCH] zh-trans: contribute style hugo shortcodes index (#11149) * zh-trans: add contribute/style/hugo-shortcodes/index.md * updates per pr review --- .../contribute/style/hugo-shortcodes/index.md | 272 ++++++++++++++++++ 1 file changed, 272 insertions(+) create mode 100644 content/zh/docs/contribute/style/hugo-shortcodes/index.md diff --git a/content/zh/docs/contribute/style/hugo-shortcodes/index.md b/content/zh/docs/contribute/style/hugo-shortcodes/index.md new file mode 100644 index 0000000000..b9523c7217 --- /dev/null +++ b/content/zh/docs/contribute/style/hugo-shortcodes/index.md @@ -0,0 +1,272 @@ +--- +approvers: +- chenopis +title: 定制 Hugo 短代码 +content_template: templates/concept +--- + + + +{{% capture overview %}} + +本页面将介绍定制 Hugo 短代码,可以用于 Kubernetes markdown 文档书写。 + + +更多关于短代码参见 [Hugo 文档](https://gohugo.io/content-management/shortcodes)。 +{{% /capture %}} + +{{% capture body %}} + +## 功能状态 + + +本站上面的 markdown 页面,你可以加入短代码来展示已经文档介绍的功能的版本和状态(state)。 + + +### 功能状态演示 + + +下面是一个功能状态代码段的演示,表明这个功能已经在 Kubernetes v1.10时就已经稳定了。 + +``` +{{}} +``` + + +会转换为: + +{{< feature-state for_k8s_version="v1.10" state="stable" >}} + + +`state`的可选值如下: + +* alpha +* beta +* deprecated +* stable + + +### 功能状态代码 + + +下面是为每个现有的功能状态的模板代码。 + + + +显示的 Kubernetes 默认为该页或站点版本。 +这个可以通过修改 for_k8s_version 短代码参数来调整。 + +``` +{{}} +``` + + +会转换为: + +{{< feature-state for_k8s_version="v1.10" state="stable" >}} + + +#### Alpha 功能 + +``` +{{}} +``` + + +会转换为: + +{{< feature-state state="alpha" >}} + + + +#### Beta 功能 + +``` +{{}} +``` + + +会转换为: + +{{< feature-state state="beta" >}} + + +#### 稳定功能 + +``` +{{}} +``` + + +会转换为: + +{{< feature-state state="stable" >}} + + +#### 废弃功能 + +``` +{{}} +``` + + +会转换为: + +{{< feature-state state="deprecated" >}} + + +## 词汇 + + + +你可以通过加入术语词汇的短代码,来自动更新和替换相应链接中的内容([我们的词汇库](/docs/reference/glossary/)) +这样,在浏览在线文档,鼠标移到术语上时,术语解释就会显示在提示框中。 + + + +词汇术语的原始数据保存在 [https://github.com/kubernetes/website/tree/master/content/en/docs/reference/glossary](https://github.com/kubernetes/website/tree/master/content/en/docs/reference/glossary),每个内容文件对应相应的术语解释。 + + +### 词汇演示 + + + +例如,下面的代码在 markdown 中将会转换为 `{{< glossary_tooltip text="cluster" term_id="cluster" >}}`,然后在提示框中显示。 + +````liquid +{{}} +```` + + +## 标签页 + + +在本站的 markdown 页面(`.md` 文件)中,你可以加入一个标签页集来显示不同形式的解决方案。 + + +标签页的短代码包含以下参数: + + + +* `name`: 标签页上的名字。 +* `codelang`: 如果要在`tab`短代码中加入内部内容,需要告知 Hugo 使用的是什么代码语言,方便代码高亮。 +* `include`: 标签页中所要包含的文件。如果标签页是在 Hugo 的页面包([leaf bundle](https://gohugo.io/content-management/page-bundles/#leaf-bundles))中,文件(可以是 Hugo 所支持的 MIME 类型文件)将会在包中查找。如果不是,所要包含的内容页面将会在当前路径的相关路径下查找。注意,在`include`属性部分,不能加入短代码内部内容,必须要使用自结束(self-closing)的语法。 +非内容文件将会被代码高亮。如果没有在`codelang`进行声明的话,所用的代码语言将会来自文件名。 + + + +* 如果内部内容是 markdown, 你必须要使用 `%` 分隔符来包装标签页,例如,`{{%/* tab name="Tab 1" %}}This is **markdown**{{% /tab */%}}` +* 可以在标签页集中混合使用上面的各种变形。 + + +下面是演示标签页短代码。 + +{{< note >}} +The tab **name** in a `tabs` definition must be unique within a content page. +一个内容页面下的,标签页定义中的标签页 **名** 必须是唯一的。 +{{< /note >}} + + +### 标签页演示:代码高亮 + +```go-text-template +{{}} +{{{< tab name="Tab 1" codelang="bash" >}} +echo "This is tab 1." +{{< /tab >}} +{{< tab name="Tab 2" codelang="go" >}} +println "This is tab 2." +{{< /tab >}}} +{{< /tabs */>}} +``` + + +会转换为: + +{{< tabs name="tab_with_code" >}} +{{< tab name="Tab 1" codelang="bash" >}} +echo "This is tab 1." +{{< /tab >}} +{{< tab name="Tab 2" codelang="go" >}} +println "This is tab 2." +{{< /tab >}} +{{< /tabs >}} + +### Tabs demo: Inline Markdown and HTML + +```go-html-template +{{}} +{{% tab name="Markdown" %}} +This is **some markdown.** +{{< note >}}**Note:** It can even contain shortcodes.{{< /note >}} +{{% /tab %}} +{{< tab name="HTML" >}} +
+

Plain HTML

+

This is some plain HTML.

+
+{{< /tab >}} +{{< /tabs */>}} +``` + + +会转换为: + +{{< tabs name="tab_with_md" >}} +{{% tab name="Markdown" %}} +This is **some markdown.** +{{< note >}}**Note:** It can even contain shortcodes.{{< /note >}} +{{% /tab %}} +{{< tab name="HTML" >}} +
+

Plain HTML

+

This is some plain HTML.

+
+{{< /tab >}} +{{< /tabs >}} + + +### 标签页演示:文件嵌套 + +```go-text-template +{{}} +{{< tab name="Content File #1" include="example1" />}} +{{< tab name="Content File #2" include="example2" />}} +{{< tab name="JSON File" include="podtemplate" />}} +{{< /tabs */>}} +``` + + +会转换为: + +{{< tabs name="tab_with_file_include" >}} +{{< tab name="Content File #1" include="example1" />}} +{{< tab name="Content File #2" include="example2" />}} +{{< tab name="JSON File" include="podtemplate" />}} +{{< /tabs >}} + + +{{% /capture %}} + +{{% capture whatsnext %}} + + +* 了解 [Hugo](https://gohugo.io/)。 +* 了解 [撰写新的话题](/docs/home/contribute/write-new-topic/)。 +* 了解 [使用页面模板](/docs/home/contribute/page-templates/)。 +* 了解 [暂存修改](/docs/home/contribute/stage-documentation-changes/)。 +* 了解 [创建 pull request](/docs/home/contribute/create-pull-request/)。 +{{% /capture %}}