列出GitHub页面中的子类别

Question

编辑:我在这里创建了一个存储库,用于测试下面的jibe答案.我访问时最终得到一个空白页面/animals,所以任何帮助都表示赞赏!

这是对这个问题的后续跟进:GitHub页面中的分层类别

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

我在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在每个子类别中放置一个文件来手动执行此操作.但这使得更新事情变得比它应该更加复杂.

我已经尝试过这个答案,但这意味着单个标签,而不是多个类别.

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

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

我还希望能够在子类别中定义frontmatter属性,可能在每个子类的index.html文件中？例如,该animals->mammals->bats->index.html文件将包含一个frontmatter变量thumbnail具有一个值"VampireBat.jpg",并且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 %}

关闭如果并且对于

{% 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 %}