Understanding Hugo’s Section Structure

Hugo organizes content into sections based on directories that contain an _index.md file. This file acts as the homepage for the section and controls how content is displayed. Here’s how sections and subsections behave:

Sections in Hugo

  1. Parent Section (_index.md):

    • A folder with an _index.md file defines a section.
    • Hugo lists the content from this section, including content from any subsections (directories with their own _index.md files).

  2. Subsection (Subfolder with _index.md):

    • A subfolder with its own _index.md file defines a subsection.
    • The content from this subsection’s _index.md will appear as part of the parent section’s content.

Example Structure

content/staging
├── _index.md        # Section 1 (Homepage)
├── new-post/index.md
└── sample
    ├── _index.md    # Section 2 (Homepage)
    ├── check.md
    └── post.md
  • Section 1: Lists new-post/index.md and includes content from sample/_index.md (Section 2), displaying it as part of Section 1.
  • Section 2: Lists content files check.md and post.md as part of its own content.

Key Takeaways

  • Parent sections list and display content from their subsections, including the content from the _index.md of the subsections.
  • Subsections list their own content (like check.md, post.md) but not the content from the parent section.