website/content/zh/docs/contribute/style/hugo-shortcodes/index.md

approvers, title, content_template

approvers	title	content_template
chenopis	定制 Hugo 短代码	templates/concept

{{% capture overview %}}

本页面将介绍定制 Hugo 短代码，可以用于 Kubernetes markdown 文档书写。

更多关于短代码参见 Hugo 文档。 {{% /capture %}}

{{% capture body %}}

功能状态

本站上面的 markdown 页面，你可以加入短代码来展示已经文档介绍的功能的版本和状态(state)。

功能状态演示

下面是一个功能状态代码段的演示，表明这个功能已经在 Kubernetes v1.10时就已经稳定了。

{{</* feature-state for_k8s_version="v1.10" state="stable" */>}}

会转换为：

{{< 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" */>}}

会转换为：

{{< feature-state for_k8s_version="v1.10" state="stable" >}}

Alpha 功能

{{</* feature-state feature-state state="alpha" */>}}

会转换为：

{{< feature-state state="alpha" >}}

Beta 功能

{{</* feature-state feature-state state="beta" */>}}

会转换为：

{{< feature-state state="beta" >}}

稳定功能

{{</* feature-state feature-state state="stable" */>}}

会转换为：

{{< feature-state state="stable" >}}

废弃功能

{{</* feature-state feature-state state="deprecated" */>}}

会转换为：

{{< feature-state state="deprecated" >}}

词汇

你可以通过加入术语词汇的短代码，来自动更新和替换相应链接中的内容（我们的词汇库） 这样，在浏览在线文档，鼠标移到术语上时，术语解释就会显示在提示框中。

词汇术语的原始数据保存在 https://github.com/kubernetes/website/tree/master/content/en/docs/reference/glossary，每个内容文件对应相应的术语解释。

词汇演示

例如，下面的代码在 markdown 中将会转换为 {{< glossary_tooltip text="cluster" term_id="cluster" >}}，然后在提示框中显示。

{{</* glossary_tooltip text="cluster" term_id="cluster" */>}}

标签页

在本站的 markdown 页面（.md 文件）中，你可以加入一个标签页集来显示不同形式的解决方案。

标签页的短代码包含以下参数：

• name: 标签页上的名字。
• codelang: 如果要在tab短代码中加入内部内容，需要告知 Hugo 使用的是什么代码语言，方便代码高亮。
• include: 标签页中所要包含的文件。如果标签页是在 Hugo 的页面包（leaf bundle）中，文件（可以是 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 >}}

标签页演示：代码高亮

{{</* 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 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

{{</* tabs name="tab_with_md" >}}
{{% tab name="Markdown" %}}
This is **some markdown.**
{{< note >}}**Note:** It can even contain shortcodes.{{< /note >}}
{{% /tab %}}
{{< tab name="HTML" >}}
<div>
	<h3>Plain HTML</h3>
	<p>This is some <i>plain</i> HTML.</p>
</div>
{{< /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 >}}

标签页演示：文件嵌套

{{</* 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 */>}}

会转换为：

{{< 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。
• 了解 撰写新的话题。
• 了解 使用页面模板。
• 了解 暂存修改。
• 了解 创建 pull request。 {{% /capture %}}