Searching baty.net

I’ve added a search page. It uses Pagefind. It turns out I’d already begun work on this with the original site. The clue was a commented-out line in my Makefile:

index:
        npx -y pagefind --site ${SITE_DIR}

All I needed to do was create a search page and add a snippet:

---
layout: layouts/base.njk
title: Search
slug: /search
---

<link href="/pagefind/pagefind-ui.css" rel="stylesheet">
<script src="/pagefind/pagefind-ui.js"></script>
<div id="search"></div>
<script>
    window.addEventListener('DOMContentLoaded', (event) => {
        new PagefindUI({ element: "#search", showSubResults: true, pageSize: 10, autofocus: true });
    });
</script>

To manually build the index, I render the site and then index it. using npx -y pagefind --site _site. I do this as part of the deploy recipe in the Makefile.

That was easy enough. I’ll fart around with the indexing a bit, but otherwise it works really well right out of the box.