Creating a paginated list of blog posts

For our blog, we want a nice list of posts on the /posts/ route. Luckily, the start of this project already has the posts.html page. We just need to adjust it to loop through the collection we just made and create links to each post that will entice a user to read one.

Figure 4.6 – Paginated pages finished

To do that, we’ll use a for loop, as we did for the triptychs in Chapter 2, but this time we’ll use the collections array that’s provided by 11ty:

---
title: "All Posts"
layout: 'layouts/base.html'
---
{% for post in collections.post %}
    <article>
        <h2 class="mb-1">
            <a href="{{ post.url }}">{{ post.data.title }}
             ...