NextInSection with nested sections with menu in config.yaml

support
1

As always, any help is much appreciated. Am failing to get the result I expect, even when copying examples.

Edit to add: For anyone looking at this who doesn’t want to read the full discussion.

  • Reverting to 0.54.0 fixed the first problem (it now correctly detects that it’s in a section)
  • However, adding weights to the pages in the section does not get the expected result. According to the docs, lowest weight comes first, but as far as I can tell, it is doing the reverse of that.
    Lists of content in Hugo | Hugo

So given:
page one - weight 100
page two - weight 200
page three - weight 300

On page two, .PrevInSection will be page three, and .NextInSection will be page one.

However, the following lists them in the order you’d expect (lowest weight first):
{{ range .Paginator.Pages }}

  • {{.Title}}

    • {{ end }}

    I’m trying to add prev/next links for some tutorials. There are three tutorials, nested under a /tutorials directory:

    content
    tutorials
    tutorial_one
    tutorial_two

    I found .NextInSection and .PrevInSection, but they are not working as expected. Thus:

    {{ if .NextInSection }}
    // do stuff
    {{ end }}

    In a page with siblings, still doesn’t show.

    I am wondering if either of the following cause the problem:

    (1) I am managing my menus and page ordering in the config.yaml. Each page has a weight assigned there. Could this be causing confusion? So perhaps .NextInSection doesn’t know about the page order?

    (2) This suggests there can be some ambiguity with nested sections: Sections | Hugo

    .CurrentSection gives the actual current section, while .Section gives the root section. If .NextInSection relies on .Section, then how do we do next/prev in nested sections?

    2

    I also have a problem with prev/next in section since version 0.55.0, it was fine before (topic here).
    What Hugo version do you use? Can you try with version 0.54 and tell us if it still fails?

    3

    Ahha! I was on 0.55.2 extended. Reverted to 0.54.0 extended, and that helped (in that we at least got it detecting it was in a section). However it looks like it doesn’t recognise the order given in the menu in the config.yaml. Guessing it needs the weighting on the individual pages’ frontmatter? And it also doesn’t treat _index.md as a page in section by the looks of it.

    4

    Then could you put +1 on this issue please?
    For the order recognition and the detection of _index.md I have no clue, sorry.

    5

    Hmm I actually cannot work out the order it is using. It’s not following the menu order, but it’s not taking the files alphabetically in the section either . . . it would make sense if it’s going through the files backwards . . .

    6

    So given this:

    {{ if .PrevInSection }}

<a href="{{ .PrevInSection.Permalink }}">Previous: {{ .PrevInSection.Title }}</a>

{{ end }}

{{ if .NextInSection }}

<a href="{{ .NextInSection.Permalink }}">Next: {{ .NextInSection.Title }}</a>

{{ end }}

    I would expect it to either:

    • Link to previous and next pages, as per the menu set in config.yaml
    • Link to previous and next pages, based on the page order in the directory (i.e. alphabetical)

    But what it’s doing (I think) is linking based on the reverse page order (i.e. start at z -> a) And ignoring _index.md

    Edit to add: so best guess is it’s going it by date, and I didn’t notice because I created a bunch of files on the same date. Assume I have to add weights to each page’s frontmatter. There has to be a better way to order stuff than hoping that every time anyone creates a new page they remember to add the correct number :man_facepalming:

    Edit to add again: adding weights does not seem to help, except possibly to ensure it goes in reverse. So given the following

    page one - weight 100
    page two - weight 200
    page three - weight 300

    page two .PrevInSection is page three, and .NextInSection is page one.

    7

    (I meant the github issue)

    You should provide a link to your source code (not excerpts, all of it) so that people can help you.

    8

    Which GitHub issue sorry? I can’t see anything about next/prev here? https://github.com/gohugoio/hugo/issues/4117

    9

    This one linked in my message.

    10

    From the docs:

    .PrevInSection

    Pointer to the previous regular page within the same section. Pages are sorted by Hugo’s default sort.

    So it has nothing to do with the menus you configure. It looks only at what section it is under, and what content would be next/previous according to the default sort order: Weight > Date > LinkTitle > FilePath

    1 Like
    11

    Heya, thanks for that - I edited with more detail further down, and it’s not behaving as expected. I assigned weights to all pages in a section, and it seemed to be showing them in reverse.

    12

    Lower weight gets higher precedence: Lists of content in Hugo | Hugo

    So, with

    the weight-sorted order would be

    • One
    • Two
    • Three

    So on page Two, Next would be One, Prev would be Three. Which is exactly what you are seeing.

    13

    Oh jeez :man_facepalming: Ok so it works through sections in the opposite order to what I thought. I’m building a tutorial, so I’m trying to allow people to navigate back and forwards in the tutorial, which means for the user (and me) page two is the next page after page one (like using a book or manual or whatever). Thank you for the help, I would have assumed it was a bug.

    14

    If you already have it ordered, you can just use .Reverse , if that makes more sense. (also on the same docs page I linked to above)

    edit: scratch the above, it still preserves the prev/next :sweat_smile:

    15

    For anyone stumbling across this, in order to get a nice tutorial navigation, you need to do something like this:

    {{ if .NextInSection }}

<a href="{{ .NextInSection.Permalink }}">Previous: {{ .NextInSection.Title }}</a>

{{ end }}

{{ if .PrevInSection }}

<a href="{{ .PrevInSection.Permalink }}">Next: {{ .PrevInSection.Title }}</a>

{{ end }}
    1 Like