Adding Pagination

Once you have more than a handful of posts, your archives pages are going to get very long. And your main blog list page will grow and grow until it’s too big to be useful. To handle this, you can break up the list of results into multiple pages, with links to navigate between the list pages. This process is known as pagination.

Hugo has built-in pagination support, and it’s enabled by default. All you have to do is change how you fetch pages and add pagination navigation to your layouts.

To use pagination, use .Paginator.Pages instead of .Pages in your range statement, like this:

 {{ range .Paginator.Pages }}

Hugo defaults to showing 10 pages at a time with its paginator, but you can override this in the layout. Let’s explore ...

Get Build Websites with Hugo now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.