Jekyll 前端变量到动态导航？

Question

总的来说，我对 jekyll 和 liquid 还很陌生，我进行了一些搜索，但找不到我的问题的具体答案。

基本上，我正在制作一个 Jekyll 网站，它需要对贡献者尽可能简单，因为网站贡献者不只有一个。考虑到这一点，我想知道是否有可能在构建时进行动态导航，该导航将在页面的前端采用自定义变量，并且如果它与顶级导航项匹配（数量不会改变），将页面 link 放入所述导航项的下拉列表中。

例如，假设我有顶级导航项：颜色和动物。如果贡献者想要添加一个名为 'Duck' 的页面，他可以将其放在前面

parent: Animal
permalink: duck

并且，在构建时，jekyll 将遍历每个页面，当它发生在页面 'duck' 时，它会将 link 作为下拉菜单放入 Animal 导航项中。

我知道还有其他方法可以进行多级导航，如 Jekyll 文档中所述，但这些方法每次都需要有人更改配置文件，除非我完全误解了它。我希望贡献者只需要担心他正在制作的页面，我认为 front-matter 是做这件事的好地方。

编辑：尽管我将提供我已经尝试过的内容，但我认为我的代码会让您发笑，因为它可能离题太远，而且可能过于复杂。以下代码假定配置中的导航数组用于具有 'text' 和 'url' 变量的顶级项目。并非所有都有 links，并且只能用作下拉菜单。它还假定页面上有一个名为 'parent-text' 的变量，这是匹配发生的地方。

{% for link in site.navigation %} <a href="{{link.url}}">{{link.text}}</a> 

{% for page in site.pages %}

{% if page.parent-text == true %}

<a href="{{page.permalink}}"> {{page.parent-text}} </a>

{% endif %}

{% endfor %}

{% endfor %}

我只是想让它输出。我稍后会处理样式和标记。

先谢谢大家了！

Answer 1

我要说的第一件事是要小心使用 page 作为循环中的变量。 page 对 Jekyll (docs) 有特殊意义，将其设置在循环中或作为变量将覆盖它通常的工作方式。

使用前面的内容

我对你的例子以及你为什么要检查 page.parent-text == true 感到有点困惑。这只会检查有问题的文件是否有带有某些键 parent-text 的前端内容，该键未设置为 false。似乎您想将其与导航文本 link 进行比较。这样的事情应该有效：

{% for link in site.navigation %}
  <a href="{{link.url}}">{{link.text}}</a>
  {% for my_page in site.pages %}
    {% if my_page.parent == link.text %}
      <a href="{{page.permalink}}"> {{page.title}} </a>
    {% endif %}
  {% endfor %}
{% endfor %}

使用数据文件

您也可以使用 a data file。假设您有一个文件 _data/nav-links.yml，它看起来像这样：

- text: Animals
  url: '/animals/'
  dropdown:
    - text: Duck
      url: '/duck/'
    - text: Goose
      url: '/goose/'

然后，在您的导航中，您有：

{% for link in site.data.nav-links %}
  <a href="{{ link.url }}">{{ link.text }}</a>
  {% for sub_link in link.dropdown %}
    <a href="{{ sub_link.url }}">{{ sub_link.text }}</a>
  {% endfor %}
{% endfor %}

这将相关信息隔离到它自己的文件中，因此贡献者不必筛选此配置。如果您认为 site.navigation 中的 link 的名称有可能发生变化，那么这是更可取的；如果其中任何一个这样做，那么所有相关页面前面内容中相应的 parent 或 parent-text 变量的 all 也必须更改。

Jekyll 前端变量到动态导航？

Jekyll front matter variable to dynamic navigation?

liquid

jekyll

使用前面的内容

使用数据文件