NextInSection

Hugo determines the next and previous page by sorting the current section’s regular pages according to this sorting hierarchy:

The sorted page collection used to determine the next and previous page is independent of other page collections, which may lead to unexpected behavior.

For example, with this content structure:

content/
├── pages/
│   ├── _index.md
│   ├── page-1.md   <-- front matter: weight = 10
│   ├── page-2.md   <-- front matter: weight = 20
│   └── page-3.md   <-- front matter: weight = 30
└── _index.md

And these templates:

{{ range .Pages.ByWeight }}
  <h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
{{ end }}

{{ with .PrevInSection }}
  <a href="{{ .RelPermalink }}">Previous</a>
{{ end }}

{{ with .NextInSection }}
  <a href="{{ .RelPermalink }}">Next</a>
{{ end }}

When you visit page-2:

• The PrevInSection method points to page-3
• The NextInSection method points to page-1

To reverse the meaning of next and previous you can change the sort direction in your site configuration, or use the Next and Prev methods on a Pages object for more flexibility.

Example

Code defensively by checking for page existence:

{{ with .PrevInSection }}
  <a href="{{ .RelPermalink }}">Previous</a>
{{ end }}

{{ with .NextInSection }}
  <a href="{{ .RelPermalink }}">Next</a>
{{ end }}

Alternative

Use the Next and Prev methods on a Pages object for more flexibility.