Is there a way to render section pagination inside page?

Support
1

Hi :slight_smile:

I’m trying to recreate my Hugo website in Zola. my website is structured in a way that the articles section has a list of articles with pagination component (that’s easy) but I want to article page itself to show the pagination from the article page, so the website layout stays the same. this is the image of the layout:

image
image2162×1536 423 KB

1 - is the article list
2 - is the article

I want to generate the article list pagination inside the article page (with next and prev buttons and list of articles).

is there a way to do it?

in Hugo I can use the {{ with }} to change the context of the specific part of the template. but in Zola I always get an error that there is no paginator.

I hope I was clear, thanks for the help!

2

I’m not entirely sure I’ve correctly understood your goals; a link to your Hugo theme demo would be useful.

Do you want a section in your articles that has something like:

← Previous article | Next article →

?

If that’s it, I added this functionality to my theme recently. You can see the code, a screenshot and context on the PR. The relevant part of the code:

{%- if page.lower or page.higher -%}
<nav class="full-width article-navigation">
    <div>
    {%- if page.lower -%}
    <a href="{{ page.lower.permalink | safe }}">&#8249; {{ page.lower.title | truncate(length=100) }}</a>
    {%- endif -%}
    </div>
    <div>
    {%- if page.higher -%}
    <a href="{{ page.higher.permalink | safe }}"> {{ page.higher.title | truncate(length=100) }} &#8250;</a>
    {%- endif -%}
    </div>
</nav>
{%- endif -%}
3

hi, thanks for replying.

I wanted to generate the article list (1) inside the article page.

4

Understood!

You can do this:

{% set last_ancestor = page.ancestors | slice(start=-1) %}
{% set current_section = get_section(path=last_ancestor.0) %}

{%- if current_section.pages -%}
<nav class="full-width article-navigation">
    <ul>
    {%- for page in current_section.pages %}
        <li><a href="{{ page.permalink | safe }}">{{ page.title }}</a></li>
    {%- endfor %}
    </ul>
</nav>
{%- endif -%}

I’m not sure it’s the most efficient way to go about it, but it works! It shows a list of all article titles in that section.

If you want the description and so on, just add those variables (e.g. {{ page.description }}) in the loop.

Hope that helps~