With Hugo (used to create this site), pages are the core of your site. Organize your site like any other Hugo project. Magic occurs with the nested sections implemention done in v0.22 of hugo (congrats @bep).
With docdock, Each content page composes the menu, they shape the structure of your website.
To link pages to each other, place them in a folders hierarchy
content
├── level-one
│ ├── level-two
│ │ ├── level-three
│ │ │ ├── level-four
│ │ │ │ ├── _index.md
│ │ │ │ ├── page-4-a.md
│ │ │ │ ├── page-4-b.md
│ │ │ │ └── page-4-c.md
│ │ │ ├── _index.md
│ │ │ ├── page-3-a.md
│ │ │ ├── page-3-b.md
│ │ │ └── page-3-c.md
│ │ ├── _index.md
│ │ ├── page-2-a.md
│ │ ├── page-2-b.md
│ │ └── page-2-c.md
│ ├── _index.md
│ ├── page-1-a.md
│ ├── page-1-b.md
│ └── page-1-c.md
├── _index.md
└── page-top.md
in the page frontmatter, add a head param to insert any HTML code before the menu entry:
example to display a “Hello”
+++
title = "Github repo"
head ="<label>Hello</label> "
+++
in the page frontmatter, add a pre param to insert any HTML code before the menu label:
example to display a github icon
+++
title = "Github repo"
pre ="<i class='fa fa-github'></i> "
+++
![]()
Add a name param next to [menu.main]
+++
[menu.main]
parent = ""
identifier = "repo"
pre ="<i class='fa fa-github'></i> "
name = "Github repo"
Add a url param next to [menu.main]
+++
[menu.main]
parent = "page"
identifier = "page-images"
weight = 23
url = "/shortcode/image/"
+++
in your frontmatter add weight param with a number to order.
+++
title="My page"
weight = 4
+++
in your frontmatter add hidden=true param.
+++
title="My page"
hidden = true
+++
One or more menuentries can be displayed unfolded by default. (like the “Getting start” menu entry in this website)
in your frontmatter add alwaysopen=true param.
example :
title = "Getting start"
description = ""
weight = 1
alwaysopen = true
Content organization is your content folder structure.