Taxonomy

How we categorise and nest content.

Hierarchy

Each guide has a parent which, at the very least, is the country in which the town or city that guide is written for exists. For example, as of writing this we have only one guide for Peru which is Cusco. Therefore Cusco’s parent is simply Peru:

Peru
└── Cusco

Some countries have multiple guides, such as Australia. In fact there are so many guides for Australian places that they are always children of states and sometimes even regions within those states. Here’s some children of the Sydney region, for example:

Australia
└── New South Wales
    └── Sydney
        ├── Hornsby
        ├── Inner West
        └── North Sydney

We use the Eleventy Navigation plugin to realise the above hierarchy rules as visually nested (in directories, breadcrumbs, and so on). This plugin isn’t perfect but does allow us to use fairly simple markup to achieve the above. For example, North Sydney’s page only needs the following to understand it is a child of Sydney:

---
eleventyNavigation:
  key: North Sydney
  parent: Sydney
---

Sydney needs only the following to understand it is a child of New South Wales:

---
eleventyNavigation:
  key: New South Wales
  parent: Australia
---

New South Wales needs only the following to understand it is a child of Australia:

---
eleventyNavigation:
  key: New South Wales
  parent: Australia
---

There is some redundancy due to the above:

• A separate Markdown file must be created for each of these pages even if don’t want them accessible to visitors (like Australia)
• Information is repeated, such as the eleventyNavigation.key value always matching the title value

Despite those above flaws, the Eleventy Navigation plugin seems to have the best balance between convenience, clarity, and sturdiness. That said: suggestions on how to better represent this hierarchy in code are welcome. Just know that there is a lot of code that is affected by the above that will need to be touched if the hierarchy is updated.

Permalinks

Countries in permalinks

There is one more bit of repetition not explained above: every guide (and hub must have a country property in their frontmatter like so:

eleventyNavigation:
  key: Cusco
  parent: Peru
country: Peru

This is because I have designed each guide’s URL to look like this:

https://brownpages.org/country/place

Which, in guides.json, is constructed like so:

"permalink": "/{{ country | slugify }}/{{ title | slugify }}/",

The country key and value cannot (within my abilities) be programmatically extracted from the eleventyNavigation.parent because the parent is not always the country. I imagine that future improvement looks something like this:

1. Do some JavaScript logic like ”go up the family tree to the oldest(?) relative for each guide and assume that is the country”
2. Do that logic for each guide
3. Somehow apply that permalink programmatically outside of guides.json, except for countries (the oldest parent) themselves
4. Remove the now-redundant country key

Hiding redundant pages

As mentioned above, some guide pages must be created simply so its children can survive. It’s just how the Eleventy Navigation plugin works. But what if you don’t want these pages to show up on the site? We use the built in frontmatter property to handle that:

permalink: false

Accessing that value elsewhere, such as in a Nunjucks layout file, looks like this:

<li>
    {% if entry.url == false %}
    {{ entry.title }}
    {% else %}
    <a href="{{ entry.url }}">{{ entry.title }}</a>
    {% endif %}
</li>

The important parts to understand from the above are:

• url is used instead of (what I presumed would be) permalink.
• Now that you have at least instance of a collection item (guide) with permalink: false, you can’t simply loop over the collection looking for {{ entry.url }}. You should wrap it in an if statement to handle ones without.

Handling duplicate place names

Sydney has an Inner West, as does Melbourne. We handle this in plain English with the possessive key, as explained in Language. To maintain unique permalinks however we need to conditionally append possessive to our aforementioned permalink default value in guides.json:

"permalink": "/{{ country | slugify }}/{{ title | slugify }}{% if possessive %}-{{ eleventyNavigation.parent | slugify }}{% endif %}/",

We are using the parent value (always a city or region) to make the permalinks unique when possessive is true. possessive itself is used to differentiate from another instance of the name in the same country, so it is the perfect boolean. Now these two name clashes will be formatted as so:

australia/inner-west-sydney

australia/inner-west-melbourne