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>