Monday Morning
Okay, I think I got the breadcrumbs working nicely with the official Navigation plugin. By itself, this is pretty easy to use. In the front matter, you define a key (what label this page uses for breadcrumbs) and a parent (the label above it in the heirarchy). So my chapters have a parent of "Pride & Prejudice", and the index for Pride & Prejudice has a parent of "Classics", which itself has a parent of "Home". Eleventy pieces these together automatically:
And then from there I was able to format it in my layout to make it look like what I'm using now.
But then I decided I wanted to get fancy with it. If the title I add to the front matter is "Chapter 1: Much Ado About Bingley", I want to shorten that to just "Chapter 1" for places like the breadcrumbs and the HTML page title. So, I create a new front matter item called short. Which is the same as the key I'm using for breadcrumbs, so it would be nice if I could tell Eleventy I want to use the short as the key. It turns out, I can, using eleventyComputed (referenced in the Computed Data doc), which lets me re-use front matter items so I only have to set them in one place:
---
title: "Chapter 1: Much Ado About Bingley"
short: "Chapter 1"
section: "Pride & Prejudice"
eleventyComputed:
eleventyNavigation:
key: "{{ title }}"
parent: "{{ section }}"
---Then I go, okay, but I'm going to have to keep the eleventyComputed segment on every page even though it's going to be the same for all of them; be nice if I could just maintain that in one place. Look at that, the documentation has an example of making that happen using what is called a Directory Data File. Although the corresponding doc page does a really bad job explaining what this actually is, I found a blog post that broke it down, and it's actually pretty simple. You put settings in the directory file, they get applied to all pages in the same directory. So not just the breadcrumb navigation, but all the common front matter items too, like template, tags, and section. The front matter data for Chapter 1, which was starting to get a little bloated, now looks like this, because the directory data file handles everything else that's common:
---
title: "Chapter 1: Much Ado About Bingley"
short: "Chapter 1"
date: 2025-01-01
---Meanwhile, the directory file is passing over the navigation details to the layout, and the breadcrumbs just work. Not bad.
The downside to the data directory file is that currently, my chapter pages are in the same folder as my book index page. I don't want the index page to have all the same properties, so I need to separate my chapter pages by putting them into a sub-folder. This isn't unreasonable, but it will break any existing hyperlinks to those pages when I upload them (not counting those in navigation, which Eleventy is generating on the fly). I could designate permalinks to fix this, but then it breaks the path to the images I'm using in those pages; and I could fix that, but it's going to lead to an inconsistent file structure across the site... so realistically it's probably going to be better if I just go ahead and break the links. I can't imagine people have been bookmarking and sharing this backwoods blog's individual chapters and posts anyway.
BUT, with navigation completely handled now... I'm kind of in a spot where I'm familiar enough with Eleventy that it could automate a good deal for me and save me a lot of the fiddly work I currently do. Next, I'd really like to see if there's a way if I can tell WHERE in the layout I want portions of a template to go (so I could say, THIS goes under the page title, THAT goes in the sidebar...). I'm actually a little worried about this one, I haven't come across anything yet that indicates it's possible. Hopefully I'm wrong. Guess we'll see!