Sections
概述
部分是顶级的内容目录，或者是带有_index.md文件的任何内容目录。带有_index.md文件的内容目录也被称为分支包。部分模板在上下文中接收一个或多个页面集合。
一个典型的站点由一个或多个部分组成。例如：
content/
├── articles/ <-- 部分（顶级目录）
│ ├── 2022/
│ │ ├── article-1/
│ │ │ ├── cover.jpg
│ │ │ └── index.md
│ │ └── article-2.md
│ └── 2023/
│ ├── article-3.md
│ └── article-4.md
├── products/ <-- 部分（顶级目录）
│ ├── product-1/ <-- 部分（有 _index.md 文件）
│ │ ├── benefits/ <-- 部分（有 _index.md 文件）
│ │ │ ├── _index.md
│ │ │ ├── benefit-1.md
│ │ │ └── benefit-2.md
│ │ ├── features/ <-- 部分（有 _index.md 文件）
│ │ │ ├── _index.md
│ │ │ ├── feature-1.md
│ │ │ └── feature-2.md
│ │ └── _index.md
│ └── product-2/ <-- 部分（有 _index.md 文件）
│ ├── benefits/ <-- 部分（有 _index.md 文件）
│ │ ├── _index.md
│ │ ├── benefit-1.md
│ │ └── benefit-2.md
│ ├── features/ <-- 部分（有 _index.md 文件）
│ │ ├── _index.md
│ │ ├── feature-1.md
│ │ └── feature-2.md
│ └── _index.md
├── _index.md
└── about.md
上面的示例有两个顶级部分：articles和products。articles下的所有目录不是部分，而products下的所有目录都是部分。一个部分中的部分被称为嵌套部分或子部分。
解释
部分和非部分的行为不同。
| 部分 | 非部分 | |
|---|---|---|
| 目录名变成URL段 | ✔️ | ✔️ |
| 具有逻辑祖先和后代 | ✔️ | ❌ |
| 具有列表页面 | ✔️ | ❌ |
使用上述示例中的文件结构：
-
articles部分的列表页面会包含所有文章，不论目录结构如何；子目录都不是部分。
-
articles/2022和articles/2023两个目录没有列表页面，它们不是部分。
-
默认情况下，products部分的列表页面包括product-1和product-2，但不包括它们的后代页面。要包括后代页面，在列表模板中使用
.RegularPagesRecursive集合，而不是.Pages集合。详情请参阅详情。 -
products部分中的所有目录都有列表页面；每个目录都是一个部分。
模板选择
Hugo在呈现页面时有一个定义好的查找顺序来确定使用哪个模板。查找规则考虑了顶级部分名称，而不考虑子部分名称。
使用上述示例中的文件结构：
| 内容目录 | 列表页面模板 |
|---|---|
| content/products | layouts/products/list.html |
| content/products/product-1 | layouts/products/list.html |
| content/products/product-1/benefits | layouts/products/list.html |
| 内容目录 | 单个页面模板 |
|---|---|
| content/products | layouts/products/single.html |
| content/products/product-1 | layouts/products/single.html |
| content/products/product-1/benefits | layouts/products/single.html |
如果您需要为子部分使用不同的模板，请在前置 matter 中指定type和/或layout。
祖先和后代
一个部分有一个或多个祖先（包括首页）和零个或多个后代。使用上述示例中的文件结构：
content/products/product-1/benefits/benefit-1.md
内容文件（benefit-1.md）有四个祖先：benefits、product-1、products和首页。这种逻辑关系允许我们使用.Parent和.Ancestors方法遍历站点结构。
例如，使用.Ancestors方法来渲染面包屑导航。
<nav aria-label="breadcrumb" class="breadcrumb">
<ol>
{{ range .Ancestors.Reverse }}
<li>
<a href="{{ .Permalink }}">{{ .Title }}</a>
</li>
{{ end }}
<li class="active">
<a aria-current="page" href="{{ .Permalink }}">{{ .Title }}</a>
</li>
</ol>
</nav>使用以下CSS代码：
.breadcrumb ol {
padding-left: 0;
}
.breadcrumb li {
display: inline;
}
.breadcrumb li:not(:last-child)::after {
content: "»";
}
Hugo会呈现以下内容，其中每个面包屑都是指向相应页面的链接：
首页 » 产品 » 产品 1 » 好处 » 好处 1