Next previous links for both section and single pages across multiple folders

support
1

I have the following two folders:

  • content/guides/chapter-one
  • content/guides/chapter-two

I would like to write a partial for all pages inside guides/ which creates “next” and “previous” links. The key functionality is for:

  • the next/prev links to work across multiple folders i.e. the last page in chapter-one/ links to the first in chapter-two/.
  • the next/prev links to appear on both _index.md pages and normal pages.

I am aware of how to weight pages, but not how to get something working across multiple folders.

My current attempt is not working. I have currently created a very basic partial which uses
{{ $pages := .CurrentSection.Pages.ByWeight.Reverse }} with {{ with $pages.Prev . }} and {{ with $pages.Next . }} and I call this partial in both the section.html and single.html layout files. I can create next/prev links in the singles pages only, but nothing is showing in the section pages (i.e. the _index.md files), and I’m not sure where to start for achieving linking across folders (i.e. the first bullet point described above.)

If anyone has some tips I’d appreciate it.

2

This is how I’ve achieved this before, but there may be a better way…

Given this content structure:

content/
└── guides/
    ├── _index.md
    ├── chapter-1/
    │   ├── _index.md
    │   ├── page-1.md
    │   ├── page-2.md
    │   └── page-3.md
    ├── chapter-2/
    └── chapter-3/

Get all regular pages in all sections under the current top-level section:

{{ $pages := sort .FirstSection.RegularPagesRecursive.ByWeight "Parent.Weight" }}

Then with this collection of pages, display the pager buttons in the single page template:

{{ with $pages.Next . }}<a href="{{ .RelPermalink }}">← {{ .Title }}</a>{{ end }}
{{ with $pages.Prev . }}<a href="{{ .RelPermalink }}">{{ .Title }} →</a>{{ end }}

Here’s a prototype of this solution: GitHub - squidfingers/hugo-section-pager-prototype

3

Thank you. I cloned your repo and had a look.

I can see that the pager buttons traverse the chapters according to their weighting. But I also see that the _index.md files are not included? In your repo, category-one/_index.md does not contain the pager buttons, nor is it linked to as the ‘previous page’ in category-one/page-one.md.

In my website, the _index.md files will need to be included because they serve as landing pages for each chapter (like somebody reading a book).

Maybe you know what small modification needs to be made?

Thanks again for the help.

4

I think you’ll need to walk the content to build the page collection.

Given that you need this collection on every page, I would build it once and stuff it in a site Store. Building the collection every time you render a single page will get expensive (i.e., why do something 1000 times when you can do it once?) build the page collection in a partial then call it with partialCached.

5

I’m not sure if that’s addressed to me or @Travis_Beckham but unfortunately I am not a very advanced Hugo user. I would need more information on how to walk through all my files and assign an ordered list of all the pages to a single variable.

As I mentioned earlier, I initially tried with {{ $pages := .CurrentSection.Pages.ByWeight.Reverse }} but this only worked inside a single folder and did not include the _index.md files.

6

@thaw

Give this a try:

git clone --single-branch -b hugo-forum-topic-54465 https://github.com/jmooring/hugo-testing hugo-forum-topic-54465
cd hugo-forum-topic-54465
hugo server

Files of interest:

  • layouts/_partials/build-page-collection.html
  • layouts/_partials/nav-prev-next-guides.html

Requires v0.146.7 or later.

7

Much appreciated. This is working for me. (thank you also, @Travis_Beckham)

8

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.