Category aware next and previous

Hi everyone,

I’m trying to create a next and previous link for my posts inside of /articles/. I’m currently using .PrevInSection and .NextInSection which work well but I’d like to go one step further and try to make it category aware.

Here’s an example of what I have:

{{ if or (.PrevInSection) (.NextInSection) }}
    <div class="next-prev">
        <hr>
        <div class="g-two-up">
            {{with .PrevInSection }}
                <div>
                    <h3>Previous</h3>
                    <p><a href=" {{ .Permalink }}">{{ .Title | safeHTML }}</a></p>
                </div>
            {{ end }}
            {{with .NextInSection }}
                <div>
                    <h3>Next</h3>
                    <p><a href=" {{ .Permalink }}">{{ .Title | safeHTML }}</a></p>
                </div>
            {{ end }}
        </div>
    </div>
{{ end }}

I realise I probably won’t be able to extend any of the above and I’ll need to use a range but I’m struggling to create the right query.

Can anyone help?

Thanks,

Dave.

What does “category aware” mean?

I think what is asked here is “.NextInTaxonomy”, am I right, @daveredfern?

In your branch logic utilize .Taxonomy to filter query results. This assumes the items you’re looking for exist in the same section. Otherwise you will either want to either:

  • Avoid using the .[Prev|Next]InSection variables and create something more suitable for your specific use case; or,
  • Refactor your content so linked content exists in the same section.

The first option would be more akin to what @nekr0z suggests.

I had the same problem. After much searching, meditation and banging my head on the wall, I’m here with a solution. But to start with, a concise definition:

Assume you have a blog where every page has a category (exactly one) and a number of tags, and want to have a “previous page in category” / “next page in category” pair of links, like you might, say, have on Wordpress.

While you might, after a cursory reading of the manual, discover that segregating your posts into directories and placing _index.md files in them gives you a .NextInSection / .PrevInSection that matches what you want, this is not what Hugo means sections to be. Misusing them like that results in generation of spurious section listing files and sends you on a wild goose chase to get rid of them – they vanish if you disableKinds = ['section'], only, with them your links also become nil. (EDIT: Since I wrote this, I have discovered that build options do in fact permit you to get rid of section list pages for good – but I’m still of the opinion that this solution is better.) The correct answer lies in building your own navigation from scratch, and while there are examples floating around in this forum, none of them deal with categories.

Well, here is one. Assuming that you always have at least one and exactly one category…

        {{ $cat := index .Params.categories 0 | urlize }}

        {{ range $catname, $catpages := .Site.Taxonomies.categories }}
          {{ if eq $catname $cat }}
            {{ $.Scratch.Set "neighbors" $catpages.Pages  }}
          {{end}}
        {{end}}

        {{$neighbors := $.Scratch.Get "neighbors"}}

        {{ if $neighbors }}
          {{ $.Scratch.Set "prev" "" }}
          {{ $.Scratch.Set "next" "" }}
          {{ range $neighbors.ByDate }}
            {{ if gt $.Date.Unix .Date.Unix }}
              {{ $.Scratch.Set "prev" . }}
            {{ end }}
          {{ end }}
          {{ range $neighbors.ByDate.Reverse }}
            {{ if lt $.Date.Unix .Date.Unix }}
              {{ $.Scratch.Set "next" . }}
            {{ end }}
          {{ end }}
        {{ end }}

By the end of this sequence, $.Scratch.Get "prev" and $.Scratch.Get "next" are the links you wanted in the first place, but I can’t help but think this looks very crude. Can anyone improve on that?

1 Like