If my tags are called "keywords" in my YAML?

[Julianoe]

I followed the instructions and managed to do it how I like it to implement a tag system.
Just by curiosity how would that block of code (from the elventy-base-blog) look like if my tag system used the word "keywords" in my files YAML?
I tried different things but I can't wrap my head around how to tell 11ty to do the same thing but with keywords instead of tags.
Is it even possible or 11ty is built to use the tags only?

function filterTagList(tags) {
  return (tags || []).filter(tag => ["all", "nav", "post", "posts"].indexOf(tag) === -1);
}
    
eleventyConfig.addFilter("filterTagList", filterTagList)
    
// Create an array of all tags
eleventyConfig.addCollection("tagList", function(collection) {
  let tagSet = new Set();
  collection.getAll().forEach(item => {
    (item.data.tags || []).forEach(tag => tagSet.add(tag));
    // (item.data.keywords || []).forEach(keyword => tagSet.add(keyword));
  });
  return filterTagList([...tagSet]);
});

those tags/keywords would be renderer in tag pages

---
layout: default
pagination:
  data: collections
  size: 1
  alias: tag
permalink: /tags/{{ tag }}/
---
<h1>Tagged « {{ tag }} »</h1>

<ol>
{% set taglist = collections[ tag ] %}
{% for note in taglist | reverse %}
  <li><a href="{{ note.url }}">{{ note.data.title }}</a></li>
{% endfor %}
</ol>

[pdehaan]

Good news, I think your (item.data.keywords || []).forEach(keyword => tagSet.add(keyword)); code is correct.
Bad news, I don't think that works.

When you set tags in your front matter (or data file), it will automatically create a matching collections.<tag> collection for you.
If you use a different front matter key (like keywords) it won't.
So in my simplified test case (based on your code above), we…:

1. paginate over the custom collections.tagList (which was defined in the .eleventy.js config file)
2. set an arbitrary alias of tag
3. loop over the collections[tag] (which will not work since we are using keywords alias in front matter instead of tags)
4. dump out the contents of {{ collections.tagList }} to confirm it is what we think it is

---
# src/index.njk
pagination:
  # 1
  data: collections.tagList
  size: 1
  # 2
  alias: tag
permalink: /tags/{{ tag | slugify }}/
---

<h1>Tagged « {{ tag }} »</h1>

<ol>
<!-- 3 -->
{% set taglist = collections[ tag ] %}
{% for note in taglist | reverse %}
  <li><a href="{{ note.url }}">{{ note.data.title }}</a></li>
{% endfor %}
</ol>

<!-- 4 -->
{{ collections.tagList | dump(2) | safe }}

OUTPUT

<h1>Tagged « animal »</h1>

<ol>

</ol>

[
  "fruit",
  "vegetable",
  "animal",
  "mineral"
]

So our collections.tagList is correct. It's a deduped version of the keywords array in each post's front matter, minus the unwanted keywords we declared in .eleventy.js.

If you have to use keywords instead of tags, you'll need to create and manage your own collections. Not impossible, but definitely more work and not super easy unless you already know the list of keywords (since I don't think you can call .addCollection() from within an .addCollection()).

[pdehaan]

Actually, I still had this tab open and thought of a cheap workaround.
You could create a custom filter, filterByKeyword, that takes an array/collection, and filters it by the specified keyword/tag. Not entirely efficient, but 🤷.

// .eleventy.js
module.exports = eleventyConfig => {
  eleventyConfig.addFilter("filterTagList", filterTagList);
  eleventyConfig.addFilter("filterByKeyword", function (collection = [], keyword = "") {
    return collection.filter(item => item.data.keywords?.includes(keyword));
  });

  // Create an array of all tags
  eleventyConfig.addCollection("tagList", function (collectionApi) {
    const tagSet = new Set();
    collectionApi.getAll().forEach(item => {
      item.data.keywords?.forEach(keyword => tagSet.add(keyword));
    });
    return filterTagList([...tagSet]);
  });

  return {
    dir: {
      input: "src",
      output: "www"
    }
  }
};

function filterTagList(tags = []) {
  return tags.filter(tag => !["all", "nav", "post", "posts"].includes(tag));
}

USAGE

---
pagination:
  data: collections.tagList
  size: 1
  alias: tag
permalink: /tags/{{ tag | slugify }}/
---

{%- set taglist = collections.all | filterByKeyword(tag) -%}

<h1>Tagged « {{ tag }} »</h1>

<ol>
{% for note in taglist | reverse %}
  <li data-keywords="{{ note.data.keywords }}"><a href="{{ note.url }}">{{ note.data.title }}</a></li>
{% endfor %}
</ol>

{{ collections.tagList | dump(2) | safe }}

OUTPUT

<h1>Tagged « animal »</h1>

<ol>

  <li data-keywords="animal,post,posts"><a href="/posts/three/">ThReE</a></li>

</ol>

[
  "fruit",
  "vegetables",
  "mineral",
  "animal"
]

[Julianoe]

Thanks a lot for your input, I'm gonna test and experiment with all this. That's huge help and also helps understand how 11ty works for these kind of things. Will be useful in any case! Thanks and good night!