This blog now has pagination

, 3 minutes to read, 60 views

This will be a rather short, and a bit of behind-the-scenes post. Long story short is that I finally added pagination to this blog.

Why pagination

When I started off this blog, I wasn’t really thinking about pagination. After all, there was no need, there was almost no content on the blog anyway. But as I slowly added more and more blog posts, I was thinking about it a bit more. With the very modern JavaScript apps, we often have some kind of pagination on the API, either offset based or page based. And that makes sense, no need to load all the data when a user is not using all of it. This is the same approach as you can see on the home page of this blog. There it should just the latest blogs, and then you have to click to show more. That system worked quite well for a while, but now, with more than 20 posts, this just becomes a long, not very nicely traversable list.

Since my website is small anyway, I was happy to waste some bits on just displaying more posts and then users could just scroll to see the posts they wanted. In fact, on my large desktop screen, I can still see all the posts on one page perfectly fine. Of course, it’s a different story with my phone or my laptop, but then — again — you can scroll and scrolling works fine. Not really a good reason to reinvent the wheel.

The question has become more which posts do I want to show to readers of this blog first. On the home page I have the three most recent ones as well as the three most popular once. I really like having the recent ones there, but I’m not sure the popular once are just as good. I mean, based on the clicks they received, they are the ones that people tend to read, but then again, do I really want to push people towards the posts that are already more popular? Not only that, but I guess I should, at least to some part, trust the opinion of other people and what they like. But then again, it feels as if I’m pushing people towards the posts that have already been read the most, what if there are some hidden gems, how will people discover this. This is a question I have so far not found the answer to, but maybe I will at some point. Maybe I will limit it to the most popular in a certain amount of time, or something similar. I will figure it out.

But for the entire list, the pagination seems fine currently. It just has older and newer, nothing more, nothing less. At the current rate, I will produce about 2 (and a bit) pages a year, which seems fine to me. Perhaps I will at some point have a smarter way to find out what to display, potentially some filters or maybe yearly archives. But currently, this is what I have and it works.

How I did it

As with so many things, Hugo makes it straightforward for you to implement this. I just used the .Paginator object that is provided by Hugo, and Bob’s your uncle. There really isn’t much to it. The only thing I had to think about was what to do with the navigation if there was nothing to navigate to. I decided to go with just disabling the link, easy enough. Added some styling using tailwind and that’s it.

Tags: Blog, Hugo