从Jekyll导航栏中排除页面

Question

我正在建立一个基本的Github托管的Jekyll网站（这么简单，我甚至不打算改变默认主题）。我有一个嵌套的网站，其中包含少量的第一层页面，我想在导航栏中显示（即默认的操作模式）。我还有一些第二层页面，我不想破坏导航栏。

虽然多级导航系统会很好，但我还是试图避免使用插件。因此，我认为最简单的解决方案是完全从导航系统中排除第二层页面。

这是一个假设的页面结构（减去其他Jekyll文件）：

jekyllsite
jekyllsite/bar
jekyllsite/bar/alice
jekyllsite/bar/alice/index.md
jekyllsite/bar/bob
jekyllsite/bar/bob/index.md
jekyllsite/bar/index.md
jekyllsite/baz
jekyllsite/baz/index.md
jekyllsite/foo
jekyllsite/foo/eggs
jekyllsite/foo/eggs/index.md
jekyllsite/foo/index.md
jekyllsite/foo/spam
jekyllsite/foo/spam/index.md
jekyllsite/index.md

按照令人敬畏的降序排列，这就是我喜欢这样做的方式：

1. 最好的情况，上下文相关的导航（没有插件可能没有想到）：访问jekyllsite / index.md时，我会得到一个单层导航栏，提供指向foo，bar和baz的链接。访问jekyllsite / bar / index.md时，我会在顶层看到一个包含foo，bar和baz的双层导航栏，第二层包含alice和bob。

2. 下一个最佳选择是让我在全局范围内进行更改，以便只有顶级目录（foo，bar，baz）被添加到导航栏。 alice，bob，spam和eggs等子目录将自动从导航栏中排除。

3. 最后（我认为这可能是最简单的）将是YAML frontmatter标志来排除页面。类似于要排除的页面前端中的nonav: true。

这似乎是一个相当常见的用例，尽管我还没有找到任何看起来像这三个选项中的任何一个的短路径的东西。我希望更熟悉Jekyll的人有一条阻力最小的路径＆＃34;答案。

Answer 1

我亲自做;

主菜单中显示的页面的正面内容

---
layout: default
title: Home
menu: main
weight: 10
---

主菜单模板（类来自twitter bootstrap）：

<ul class="nav navbar-nav">
  {% comment %}Jekyll can now sort on custom page key{% endcomment %}
  {% assign pages = site.pages | sort: 'weight' %} 
  {% for p in pages %}
    {% if p.menu == 'main' %}
      <li{% if p.url == page.url %} class="active"{% endif %}>
         <a href="{{ site.baseurl }}{{ p.url }}">{{ p.title }}</a>
      </li>
    {% endif %}
  {% endfor %}
</ul>

然后，您可以通过在yaml前端设置自定义变量来复制任何级别：

menu : foo

并将值传递给菜单模板

{% include navbar.html  menuLevel="foo" %}

并截取它：

{% if p.menu == menuLevel %}

任何不会公开菜单的页面：toto 都不会出现在导航中。

Answer 2

可以创建一个多层次的上下文相关导航，就像你所描述的那样没有插件，我已经完成了。

唯一需要注意的是，您需要使用菜单层次结构维护YAML data file - 使用我的方法，无法从目录结构自动生成此内容。

我会在这里展示简短版本，但我的博客上有更详细的说明：

• Building a pseudo-dynamic tree menu with Jekyll
• Example project on Bitbucket

---

1。创建包含菜单层次结构的YAML数据文件（/_data/menu.yml）：

- text: Home
  url: /
- text: First menu
  url: /first-menu/
  subitems:
    - text: First menu (sub)
      url: /first-menu/first-menu-sub/
      subitems:
        - text: First menu (sub-sub)
          url: /first-menu/first-menu-sub/first-menu-sub-sub/
- text: Second menu
  url: /second-menu/
  subitems:
    - text: Second menu (sub)
      url: /second-menu/second-menu-sub/

---

2。使用以下内容创建include file（/_includes/nav.html）：

{% assign navurl = page.url | remove: 'index.html' %}
<ul>
{% for item in include.nav %}
    <li>
        <a href="{{ item.url }}">
            {% if item.url == navurl %}
                <b>{{ item.text }}</b>
            {% else %}
                {{ item.text }}
            {% endif %}
        </a>
    </li>
    {% if item.subitems and navurl contains item.url %}
        {% include nav.html nav=item.subitems %}
    {% endif %}
{% endfor %}
</ul>

此包含文件将负责显示每个页面的正确导航：

• 仅显示当前页面的下一级子项
• 以粗体显示当前页面

如果你不明白包含文件在封面下做了什么，请阅读我的blog post - 我在那里详细解释了（在“递归包含文件”一节中）

---

3。在您的主layout file中，嵌入包含文件：

{% include nav.html nav=site.data.menu %}

这将显示那里的导航 请注意，我正在将步骤1中的完整数据文件传递给include。

---

就是这样！

正如我在开头所说：

这种方法的唯一缺点是，每次创建新页面时，还需要将页面的标题和URL插入数据文件中。

但另一方面，这使得非常很容易从导航中排除某些页面：您只是不将它们添加到数据文件中。

Answer 3

如果您来自基本的Jekyll主题，从标题网站导航中排除网页的最简单方法是添加unless page.exclude例外。

（page.exclude是一个新的Yaml frontmatter属性。）

默认情况下，这位于_includes/header.html：

{% for page in site.pages %}
    {% unless page.exclude %}
       {% if page.title %}
         <a class="page-link" href="{{ page.url | prepend: site.baseurl }}">{{ page.title }}</a>
       {% endif %}
    {% endunless %}
{% endfor %}

以及任何页面的Yaml frontmatter的相应标记：

---
... other attributes ...
exclude: true
---

归功于Michael Chadwick。