Jekyll 子页面导航

Question

我正在完成我的网站重新设计，只需要完成我的投资组合页面。 我想使用子目录/子页面，而不是使用文章作为投资组合条目：

...
work
  project
     index.html
  project-2
    index.html
  index.html
...

我想遍历列表中的这些子页面以显示在work/index.html 。 类似于：

<ul>
  {% for page in site.work.pages %}
    <li>
      <figure>
        <img src="/img/foo.jpg" alt="foo">
      </figure>
    </li>
  {% endfor %}
</ul>

如何做到这一点？

Answer 1

Jekyll 并不像您的示例中那样简单地支持它， 但是它是 2.0 版本。

您可以向子页面的 YAML 标头添加一个键/值对，以表示它应该出现在主索引页面上。 我有一个类似的设置，用于定义网站的主导航中应显示哪些页面。

项目/index.html 等

---
group: work
---

工作/index.html

<ul>
{% for node in site.pages %}
    {% if 'work' == node.group %}
    <li><a href="{{node.url}}">{{node.title}}</a></li>
    {% endif %}
{% endfor %}
</ul>

如果您更改 if 条件来执行 URL 的子字符串匹配，您也许可以避免需要 group 属性，但此解决方案更容易理解。

Answer 2

如果您使用jekyll build自己的页面构建，您可以简单地创建一个名为_plugins/page_filters.rb的文件，其中包含以下内容：

module Jekyll
  module PageFilters
    def children_of(all_pages, parent)
      all_pages.select { |p| child_of?(p, parent) }
    end

    private

    def child_of?(child, parent)
      parent_path = parent["path"]
      child_path = child.path

      # Exclude 'index.md' from becoming a child of itself
      return false if parent_path == child_path

      # Remove 'index.md' from the parent path
      parent_path = parent_path.split("index.md", 2).first

      child_path.start_with? parent_path
    end
  end
end

Liquid::Template.register_filter(Jekyll::PageFilters)

然后像这样调用children_of过滤器：

{% assign children = site.pages | children_of: page %}
<ul>
{% for child in children %}
    <li><a href="{{ child.url }}">{{ child.title }}</a></li>
{% endfor %}
</ul>