Navigating between articles with pagination
We are able to show visitors the latest articles, but they are unable to view previous posts. We are going to include a button that allows us to render other articles on the welcome page, and we will incorporate them in blocks of five.
We add a component with the button. In app/website/templates/components/all_posts/_button_paginator.html, add the following HTML:
{% if not is_last_page %}
<button class="button" id="paginator" data-next-page="{{
next_page }}">More posts</button>
{% endif %}
We will only show the button if we are not on the last page, which we will manage with the is_last_page variable. In addition, we will include a dataset with the next_page variable to tell the backend the next page we want to render.
The component is embedded in app/website/templates/components/all_posts/list.html:
<h1>All posts</h1> <hr> <section>...