模板类型
结构
在项目根目录的 layouts 目录中创建模板。
尽管您的站点可能不需要每个这些模板，但下面的示例对于中等复杂程度的站点来说是典型的。
layouts/
├── _default/
│ ├── _markup/
│ │ ├── render-image.html <-- render hook
│ │ └── render-link.html <-- render hook
│ ├── baseof.html
│ ├── home.html
│ ├── section.html
│ ├── single.html
│ ├── taxonomy.html
│ └── term.html
├── articles/
│ └── card.html <-- content view
├── partials/
│ ├── footer.html
│ └── header.html
└── shortcodes/
├── audio.html
└── video.html
Hugo 的 模板查找顺序 确定了模板路径，允许您为任何页面创建独特的模板。
下面描述了每种模板类型的用途。
基础
基础模板通过将其他模板包装在一个外壳内来减少重复代码。
例如，下面的基础模板调用 partial 函数来包含每个页面的 head、header 和 footer 元素的局部模板，并使用 block 函数来包含每个页面的 main 元素中的 home、single、section、taxonomy 和 term 模板。
<!DOCTYPE html>
<html lang="{{ or site.Language.LanguageCode }}" dir="{{ or site.Language.LanguageDirection `ltr` }}">
<head>
{{ partial "head.html" . }}
</head>
<body>
<header>
{{ partial "header.html" . }}
</header>
<main>
{{ block "main" . }}{{ end }}
</main>
<footer>
{{ partial "footer.html" . }}
</footer>
</body>
</html>了解更多关于基础模板的信息。
主页
主页模板渲染您网站的主页。对于单页站点，这是唯一需要的模板。
例如，下面的主页模板从基础模板继承了站点的外壳，并使用页面列表渲染主页内容。
{{ define "main" }}
{{ .Content }}
{{ range site.RegularPages }}
<h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
{{ end }}
{{ end }}了解更多关于主页模板的信息。
单页
单页模板渲染单个页面。
例如，下面的单页模板从基础模板继承了站点的外壳，并渲染每个页面的标题和内容。
{{ define "main" }}
<h1>{{ .Title }}</h1>
{{ .Content }}
{{ end }}了解更多关于单页模板的信息。
章节
章节模板通常渲染一个章节中的页面列表。
例如，下面的章节模板从基础模板继承了站点的外壳，并渲染当前章节中的页面列表。
{{ define "main" }}
<h1>{{ .Title }}</h1>
{{ .Content }}
{{ range .Pages }}
<h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
{{ end }}
{{ end }}了解更多关于章节模板的信息。
分类
分类模板渲染 分类中的术语列表。
例如，下面的分类模板从基础模板继承了站点的外壳，并渲染当前分类中的术语列表。
{{ define "main" }}
<h1>{{ .Title }}</h1>
{{ .Content }}
{{ range .Pages }}
<h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
{{ end }}
{{ end }}了解更多关于分类模板的信息。
术语
术语模板渲染与术语关联的页面列表。
例如，下面的术语模板从基础模板继承了站点的外壳，并呈现与当前术语关联的页面列表。
{{ define "main" }}
<h1>{{ .Title }}</h1>
{{ .Content }}
{{ range .Pages }}
<h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
{{ end }}
{{ end }}了解更多关于术语模板的信息。
局部模板
局部模板通常用于呈现站点的组件，但您也可以创建返回值的局部模板。
例如，下面的局部模板呈现版权信息。
了解更多关于局部模板的信息。
内容视图
内容视图模板类似于局部模板，通过在 Page 对象上调用 Render 方法来调用。与局部模板不同，内容视图模板
- 自动继承当前页面的上下文
- 遵循查找顺序，允许您针对给定的内容类型或部分
例如，下面的首页模板从基础模板继承了站点的外壳，并为站点“articles”部分中的每个页面呈现一个卡片组件。
{{ define "main" }}
{{ .Content }}
<ul>
{{ range where site.RegularPages "Section" "articles" }}
{{ .Render "card" }}
{{ end }}
</ul>
{{ end }}<div class="card">
<h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
{{ .Summary }}
</div>了解更多关于内容视图模板的信息。
渲染钩子
渲染钩子模板会覆盖 Markdown 到 HTML 的转换。
例如，下面的渲染钩子模板会为外部链接添加 rel 属性。
{{- $u := urls.Parse .Destination -}}
<a href="{{ .Destination | safeURL }}"
{{- with .Title }} title="{{ . }}"{{ end -}}
{{- if $u.IsAbs }} rel="external"{{ end -}}
>
{{- with .Text | safeHTML }}{{ . }}{{ end -}}
</a>
{{- /* chomp trailing newline */ -}}了解更多关于渲染钩子模板的信息。
短代码
短代码模板用于呈现站点的组件。与局部模板不同，短代码模板是从内容页面调用的。
例如，下面的短代码模板从全局资源呈现音频元素。
{{ with resources.Get (.Get "src") }}
<audio controls preload="auto" src="{{ .RelPermalink }}"></audio>
{{ end }}从您的内容页面调用短代码
{{< audio src="audio/test.mp3" >}}了解更多关于短代码模板的信息。
其他
使用其他专用模板来创建