修改:我已经创建了一个存储库here,可以在下面测试jibe的答案。我访问/animals
时最终得到一个空白页面,所以感谢任何帮助!
这是对此问题的跟进:Hierarchical Categories in GitHub Pages
在那个问题中,我发现了如何列出特定层次类别的帖子。现在我想弄清楚如何列出特定层次类别的子类别。
我在GitHub页面上使用Jekyll,我想要像这样的分层类别:
我希望用户能够访问/animals
并查看子类别列表(mammals
和reptiles
)。然后,如果他们转到/animals/mammals
,他们会看到cats
和dogs
被列为子类别。
我目前正在通过在每个子类别中放置index.html
文件来手动执行此操作。但这使得更新事情变得比它应该更加复杂。
我已尝试关注this answer,但这意味着单个标记,而不是多个类别。
问题是任何特定的类别可能都不是唯一的,所以我可以有这样的东西:
我还希望能够在子类别中定义frontmatter属性,可能在每个子类的index.html文件中?例如,animals->mammals->bats->index.html
文件将包含值为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
是该类别中所有帖子的列表,忽略了任何分层信息。
除了手动操作之外,还有更好的方法吗?
答案 0 :(得分:1)
正如我在删除的答案中建议的那样,我发布了我之前问题答案的改进版本。我还添加了回答新问题的信息(也已删除):
感谢您的回复。这几乎可行,但它有一些问题。最重要的是,它不支持具有相同名称的子类别(如animals-&gt; bats和baseball-&gt; bats)。它还列出了特定类别下的每个子类别和每个帖子。我只想列出子类别,而不是帖子。有没有办法修改您的方法以满足这些要求? - Kevin Workman昨天
相应地修改_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,您需要创建所需的列表。 它将使用过滤器索引项目。从顶部目录开始,您的animals集合应该如下所示(每个文件夹中包含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"
来区分动物 - >蝙蝠和棒球 - >蝙蝠。
答案 1 :(得分:1)
请参阅simpyll.com了解
有关网站代码,请参阅github
使用路径&#39; /&#39;将var page_depth指定为当前页面深度作为计数变量
{% assign page_depth = page.url | split: '/' | size %}
将var page_parent指定为最后一个目录的slug&quot; index.md&#39;
{% 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指定为最后一个目录的slug&quot; index.md&#39;对于网站中的每个页面
{% 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 %}