Ancestors
section 是指頂層內容目錄,或是任何包含 _index.md 檔案的內容目錄。
以下是內容結構範例:
content/
├── auctions/
│ ├── 2023-11/
│ │ ├── _index.md <-- 前置內容: weight = 202311
│ │ ├── auction-1.md
│ │ └── auction-2.md
│ ├── 2023-12/
│ │ ├── _index.md <-- 前置內容: weight = 202312
│ │ ├── auction-3.md
│ │ └── auction-4.md
│ ├── _index.md <-- 前置內容: weight = 30
│ ├── bidding.md
│ └── payment.md
├── books/
│ ├── _index.md <-- 前置內容: weight = 10
│ ├── book-1.md
│ └── book-2.md
├── films/
│ ├── _index.md <-- 前置內容: weight = 20
│ ├── film-1.md
│ └── film-2.md
└── _index.md
以及這段範本:
{{ range .Ancestors }}
<a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a>
{{ end }}
在 2023 年 11 月的拍賣頁面上,Hugo 會呈現:
<a href="/auctions/2023-11/">2023 年 11 月的拍賣</a>
<a href="/auctions/">拍賣</a>
<a href="/">首頁</a>
在上述範例中,可以注意到 Hugo 按照從最近到最遠的順序排列祖先,這使得麵包屑導航變得簡單:
<nav aria-label="breadcrumb" class="breadcrumb">
<ol>
{{ range .Ancestors.Reverse }}
<li>
<a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a>
</li>
{{ end }}
<li class="active">
<a aria-current="page" href="{{ .RelPermalink }}">{{ .LinkTitle }}</a>
</li>
</ol>
</nav>
加上一些 CSS,上述代碼會呈現如下,並且每個麵包屑都會連結到它的頁面:
首頁 > 拍賣 > 2023 年 11 月的拍賣 > 拍賣 1