NextInSection
Syntax
PAGE.NextInSection
Returns
page.Page
Hugo determines the next and previous page by sorting the current section’s regular pages according to this sorting hierarchy:
Field | Precedence | Sort direction |
---|---|---|
weight |
1 | descending |
date |
2 | descending |
linkTitle |
3 | descending |
path |
4 | descending |
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:
layouts/_default/list.html
{{ range .Pages.ByWeight }}
<h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
{{ end }}
layouts/_default/single.html
{{ 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.