Written by Jamie Tanna
on 
CC-BY-NC-SA-4.0 Apache-2.0
1 mins
🤖 This post includes some LLM-derived content 🤖

Adding date-based pagination to my site

A screenshot of the "Browse by date" section at the bottom of Jamie's home page's feed (and also available on other feed pages) which shows a heatmap-style calendar view from 2026-2013, showing how many blog posts have appeared each month. Lower numbers (like 71 posts per month) are shown in a dark green, and higher numbers like 159/mo are in a brighter green, with the brightest green for 269/mo or 301/mo. Each number has a link, so you can click through directly to i.e. May 2020

Something I've long wanted is the ability to paginate this Hugo website's pages by day.

Given this is an IndieWeb website, I post a mix of content from articles, likes of others' posts and my daily step counts, totalling roughly 46000 posts.

Although this may make it easier to browse, it's also an operational want - every time I post something new, each of the feeds on my site that are paginated will move forward one entry, leading to effectively all of my feed pages re-building, leading to potentially ~1GB of HTML re-building and deploying up to AWS S3, which is not ideal!

Additionally, having date-based pagination allows someone to "URL hack", by i.e. taking this blog post's URL, https://www.jvt.me/posts/2026/10/28/date-based-pagination/, and browsing to /posts/2026/10/ to see what I've written in October.

This is something I've wanted as early as 2020, but has been an ask since 2014 upstream, but thankfully it's now possible using Content Adapters.

This also allowed me to get Claude Opus 5.5 to create a heatmap-ish calendar for how frequently posts exist i.e. from my home page:

A screenshot of the "Browse by date" section at the bottom of Jamie's home page's feed (and also available on other feed pages) which shows a heatmap-style calendar view from 2026-2013, showing how many blog posts have appeared each month. Lower numbers (like 71 posts per month) are shown in a dark green, and higher numbers like 159/mo are in a brighter green, with the brightest green for 269/mo or 301/mo. Each number has a link, so you can click through directly to i.e. May 2020

Hopefully this is useful - I've still got some tweaks to do, and feedback welcome!

Written by Jamie Tanna's profile image Jamie Tanna on , and last updated on .

Content for this article is shared under the terms of the Creative Commons Attribution Non Commercial Share Alike 4.0 International, and code is shared under the Apache License 2.0.

#www.jvt.me #hugo.

🤖 Content in this blog post includes code derived from the following LLMs:

PurposeModelNotes
CodeNo usage
Editorial supportNo usage
Prose (verbatim or edited)No usage
Images, visualisation, data and/or metricsclaude:opus-5.5Wrote the Hugo template + CSS to present the calendar view

This post was filed under articles.

Interactions with this post

Interactions with this post

Below you can find the interactions that this page has had using WebMention.

Have you written a response to this post? Let me know the URL:

Do you not have a website set up with WebMention capabilities? You can use Comment Parade.