CONTENT MANAGEMENT FUNDAMENTALS

Content organization

頁面包裹(Page bundles)

Hugo 0.32 引入了與頁面相關的圖像以及其他資源,並打包為「頁面包裹」(Page Bundles)。

這些術語密切相關,因此您還需要參閱頁面資源圖像處理以完整了解概念。

content/
├── blog/
│   ├── hugo-is-cool/
│   │   ├── images/
│   │   │   ├── funnier-cat.jpg
│   │   │   └── funny-cat.jpg
│   │   ├── cats-info.md
│   │   └── index.md
│   ├── posts/
│   │   ├── post1.md
│   │   └── post2.md
│   ├── 1-landscape.jpg
│   ├── 2-sunset.jpg
│   ├── _index.md
│   ├── content-1.md
│   └── content-2.md
├── 1-logo.png
└── _index.md

以上文件結構顯示了三個包裹。請注意,首頁包裹無法包含其他內容頁面,但可以包含其他文件(例如圖像)。

內容來源的組織方式

在 Hugo 中,您的內容應以反映生成網站的方式進行組織。

雖然 Hugo 支援任意層級嵌套的內容,但頂層目錄(例如 content/<DIRECTORIES>)在 Hugo 中具有特殊意義,它被認定為用於決定佈局等的內容類型。要深入瞭解包括如何嵌套的部分,請參閱[部分 (sections)]。

在未做其他配置的情況下,下列組織方式將自動生效:

.
└── content
    └── about
    |   └── index.md  // <- https://example.org/about/
    ├── posts
    |   ├── firstpost.md   // <- https://example.org/posts/firstpost/
    |   ├── happy
    |   |   └── ness.md  // <- https://example.org/posts/happy/ness/
    |   └── secondpost.md  // <- https://example.org/posts/secondpost/
    └── quote
        ├── first.md       // <- https://example.org/quote/first/
        └── second.md      // <- https://example.org/quote/second/

Hugo 中的路徑拆解

以下示例說明了內容組織與 Hugo 網站輸出 URL 結構之間的關係。這些示例假定您正在使用友善 URL,這是 Hugo 的預設行為。還假設您的 網站配置檔案 中設置了 baseURL = "https://example.org/"

索引頁面:_index.md

_index.md 在 Hugo 中具有特殊角色。它允許您為 homesectiontaxonomyterm 頁面新增前置內容和內容。

您可以為首頁以及每個內容部分、分類和術語分別建立一個 _index.md。以下展示了放置於 Hugo 網站 posts 部分清單頁面中的 _index.md

.         url
.       ⊢--^-⊣
.        path    slug
.       ⊢--^-⊣⊢---^---⊣
.           file path
.       ⊢------^------⊣
content/posts/_index.md

構建後,這將輸出為以下目的地及相關值:

                     url ("/posts/")
                    ⊢-^-⊣
       baseurl      section ("posts")
⊢--------^---------⊣⊢-^-⊣
        permalink
⊢----------^-------------⊣
https://example.org/posts/index.html

sections 可以隨意嵌套至任意深度。需理解的是,為了讓部分樹完全具備導航功能,至少最底層的部分必須包含內容檔案(例如 _index.md)。

部分中的單一頁面

部分中的每個單一內容檔案都將由單一範本進行渲染。以下是 posts 中一篇單一文章的示例:

                   path ("posts/my-first-hugo-post.md")
.       ⊢-----------^------------⊣
.      section        slug
.       ⊢-^-⊣⊢--------^----------⊣
content/posts/my-first-hugo-post.md

當 Hugo 構建您的網站時,內容將輸出到以下目的地:

                               url ("/posts/my-first-hugo-post/")
                   ⊢------------^----------⊣
       baseurl     section     slug
⊢--------^--------⊣⊢-^--⊣⊢-------^---------⊣
                 permalink
⊢--------------------^---------------------⊣
https://example.org/posts/my-first-hugo-post/index.html

路徑解釋

以下概念深入解釋了專案組織與 Hugo 預設構建行為之間的關係。

section

內容的預設類型由存放內容的部分(section)決定。section 是由專案 content 目錄中的位置決定的,無法在前置內容中指定或覆寫。

slug

slug 是 URL 路徑的最後一段,由檔案名稱決定,可在前置內容中透過 slug 值覆寫。詳細內容請參閱URL 管理

path

內容的 path 是由部分到檔案的路徑決定的:

  • 它基於內容存放位置的路徑,並且
  • 不包含 slug。

url

url 是整個 URL 路徑,由檔案路徑決定,可在前置內容中透過 url 值覆寫。詳情請參閱URL 管理