列出 GitHub 页面中的子类别

Question

编辑：我创建了一个存储库here，用于测试下面的 jibe 答案。当我访问/animals 时，我只是得到一个空白页面，因此感谢您的帮助！

这是这个问题的后续：Hierarchical Categories in GitHub Pages

在那个问题中，我发现了如何列出特定层次类别的帖子。现在我想弄清楚如何列出特定层次类别的子类别。

我在 GitHub 页面上使用 Jekyll，我希望有这样的分层类别：

• 动物 -> 哺乳动物 -> 猫 -> _posts -> housecat.md, tiger.md
• 动物 -> 哺乳动物 -> 狗 -> _posts -> poodle.md, doberman.md
• 动物 -> 爬行动物 -> 蜥蜴 -> _posts -> iguana.md, chameleon.md

我希望用户能够访问 /animals 并查看子类别列表（mammals 和 reptiles）。然后，如果他们转到/animals/mammals，他们会看到cats 和dogs 被列为子类别。

我目前通过在每个子类别中放置一个index.html 文件来手动执行此操作。但这使得更新事情比它应该做的要复杂得多。

我试过关注this answer，但那是针对单个标签，而不是多个类别。

问题是任何特定类别都可能不是唯一的，所以我可以有这样的东西：

• 动物 -> 哺乳动物 -> 蝙蝠 -> _posts -> vampire.md, fruit.md
• 运动 -> 棒球 -> 蝙蝠 -> _posts -> wiffle.md, teeball.md

我还希望能够在子类别中定义 frontmatter 属性，也许在每个子类别的 index.html 文件中？例如，animals->mammals->bats->index.html 文件将包含一个值为 "VampireBat.jpg" 的 frontmatter 变量 thumbnail，而 sports->baseball->bats->index.html 将具有 thumbnail 的 "YellowWiffleBat.png"。我希望能够从父级别访问这些变量（以显示缩略图和指向子类别的链接）。

我的第一个想法是直接访问子类别，如下所示：

{% for mammalType in site.categories.animals.mammals %}
   <p>{{ mammalType.title }}</p>
   <img src="(( mammalType.thumbnail }}" />
{% endfor %}

我将使用页面本身的类别进行概括：

{% for subcategory in page.categories %}
   <p>{{ subcategory.title }}</p>
   <img src="(( subcategory.thumbnail }}" />
{% endfor %}

但这根本不起作用，因为site.categories.whatever 是该类别中所有帖子的列表，忽略了任何层次信息。

除了手动操作之外，还有更好的方法吗？

Answer 1

请参阅simpyll.com 进行演示

网站代码见github

使用路径 '/' 作为计数变量，将 var page_depth 分配为当前页面深度

{% assign page_depth = page.url | split: '/' | size %}

将 var page_parent 指定为最后一个包含 'index.md' 的目录的 slug

{% assign page_parent = page.url | split: '/' | last %}

循环浏览网站中的每个页面

{% for node in site.pages offset:1 %}

跳过网站根目录

{% if node.url == '/' %}
{{ continue }}
{% else %}

从网站的每个页面中删除反斜杠

{% assign split_path = node.url | split: "/" %}

为网站中的每个页面分配 var node_last

{% assign node_last = split_path | last %}

将 var node_parent 指定为网站中每个页面的最后一个包含“index.md”的目录的 slug

{% assign node_parent = node.url | remove: node_last | split: '/' | last %}

为网站中的每个页面分配 node_url

{% assign node_url = node.url %}

遍历网站中每个页面路径中的每个 slug

{% for slug in split_path offset:1 %}

分配 var slug 作为每个 slug 的名称，因此给它一个名称

{% assign slug = slug %}

用 forloop.index 分配 slug_depth

{% assign slug_depth = forloop.index %}

关闭

{% endfor %}

获取网站中每个页面的子目录，将当前页面的深度和父级与网站中每个其他页面的深度和父级进行比较

{% if slug_depth == page_depth and page_parent == node_parent %}<li><a href="{{ node_url }}">{{ slug }}</a></li>{% endif %}

获取 root 的子目录（我们在这个脚本的前面跳过了）。我们可以单独使用深度来定义它。

{% if slug_depth == 1 and page.url == '/' and slug != 'search.json' and slug != 'sitemap.xml' %}<li><a href="{{ node_url }}">{{{slug}}</a></li>{% endif %}

关闭 if 和 for

{% endif %}
{% endfor %}

总共：

  {% assign page_depth = page.url | split: '/' | size %}
  {% assign page_parent = page.url | split: '/' | last %}
  {% for node in site.pages offset:1 %}
  {% if node.url == '/' %}
  {{ continue }}
  {% else %}
  {% assign split_path = node.url | split: "/" %}
  {% assign node_last = split_path | last %}
  {% assign node_parent = node.url | remove: node_last | split: '/' | last %}
  {% assign node_url = node.url %}
  {% for slug in split_path offset:1 %}
  {% assign slug = slug %}
  {% assign slug_depth = forloop.index %}
  {% endfor %}
  {% if slug_depth == page_depth and page_parent == node_parent %}
  <li><a href="{{ node_url }}">{{ slug }}</a></li>
  {% endif %}
  {% if slug_depth == 1 and page.url == '/' and slug != 'search.json' and   slug != 'sitemap.xml' %}
  <li><a href="{{ node_url }}">{{{slug}}</a></li>
  {% endif %}
  {% endif %}
  {% endfor %}

Answer 2

正如我已删除的答案中所建议的那样，我发布了我对您之前问题的答案的改进版本。我还添加信息以回答您的新问题（也已删除）：

感谢您的回复。这几乎可以工作，但它有一些问题。最重要的是，它不支持具有相同名称的子类别（如动物->蝙蝠和棒球->蝙蝠）。它还列出了特定类别下的每个子类别和每个帖子。我只想列出子类别，而不是帖子。有没有办法修改您的方法以满足这些要求？ ——凯文·沃克曼昨天

相应地修改你的 _config.yml

collections:
    animals:
        output: true
        mammals:
            output: true
            cats:
                output: true
            dogs:
                output: true
        reptiles:
            output: true
            lizards:
                output: true

然后创建结构：

mkdir -p _animals/reptiles/lizards
mkdir -p _animals/mammals/cats
mkdir _animals/mammals/dogs

添加你的 md 文件和所有你需要的 index.html 来创建你想要的列表。 这将使用过滤器索引项目。在顶级目录中，您的动物集合应如下所示（每个文件夹中都有 index.html）：

清洁剂

root/
└── _animals/
    ├── index.html
    ├── mammals
    │   ├── cats
    │   │   ├── housecat.md
    │   │   └── tiger.md
    │   ├── dogs
    │   │   ├── doberman.md
    │   │   └── poodle.md
    │   └── index.html
    └── reptiles
        └── lizards
            ├── chameleon.md
            └── iguana.md

新您可以仅列出子类别，无论是否深入（带有可选参数）_includes/list_subcategories.html

 {% assign animals = site.animals| sort:'title' %}
 {% assign from = page.url | remove: '/index.html' %}
 {% assign deep = (page.url | split: '/' | size) + 1 %}
 {% for animal in animals %}
 {% assign d = animal.url | remove: '/index.html' | split: '/' | size %}
 {% if animal.url != page.url and animal.url contains from and animal.url contains "index" and (include.dig or deep == d) %}
 <a  href={{ animal.url | prepend: site.baseurl }}>{{animal.title}}</a>
 {% endif %}
 {% endfor %}

改进类似于列出动物_includes/list_animals.html

{% assign animals = site.animals| sort:'title' %}
{% assign from = page.url | remove: '/index.html' %}
{% assign deep = (page.url | split: '/' | size) + 1 %}
{% for animal in animals %}
{% assign d = animal.url | remove: '/index.html' | split: '/' | size %}
{% if animal.url contains "index" or animal.url == page.url %}
{% else %}
    {% if animal.url contains from  and (include.dig or deep == d) %}
    <a  href={{ animal.url | prepend: site.baseurl }}>{{animal.title}}</a>
    {% endif %}
{% endif %}
{% endfor %}

列出animals/index.html 中的所有子类别和所有动物：

---
title: animals
---
{% include list_subcategories.html dig=true %}
<hr>
{% include list_animals.html dig=true %}

例如，列出animals/mammals/index.html 中的所有哺乳动物和子类别：

---
title: animals
---
{% include list_subcategories.html %}
<hr>
{% include list_animals.html %}

最后生成的结构应该是这样的（还有一些 index.html）：

清洁剂

root/
├─ _animals/
│   └─── ...
└── _site
    └── animals
        ├── index.html
        ├── mammals
        │   ├── cats
        │   │   ├── housecat.html
        │   │   └── tiger.html
        │   ├── dogs
        │   │   ├── doberman.html
        │   │   └── poodle.html
        │   └── index.html
        └── reptiles
            └── lizards
                ├── chameleon.html
                └── iguana.html

它解决了你的问题。我从分类学改为挖掘，但您也可以通过输入taxonomy="baseball/bats" 或taxonomy="animals/bats" 来区分动物->蝙蝠和棒球->蝙蝠。