Jekyll用yaml front matter检测sass文件作为页面

Question

我为导航菜单制作了一个液体模板，并尝试将活动的css规则添加到当前活动菜单项。

这是我的液体标签，用于渲染菜单项：

<ul class="list-inline float-right">
    {% assign menu_pages = site.pages | sort: 'index' %}
    {% for p in menu_pages limit 3 %}
        {% if page.menu_title and page.url == p.url %}
        <li class="active"><a href="{{ p.url | prepend: site.baseurl }}">{{ p.menu_title }}</a></li>
        {% else %}
        <li><a href="{{ p.url | prepend: site.baseurl }}">{{ p.menu_title }}</a></li>
        {% endif %}
    {% endfor %}
</ul>

index是用于对菜单项进行排序的yaml front matter变量。
menu_title是一个yaml前端变量，用于添加菜单栏上显示的自定义菜单标题。

我将上面的两个前面的事物变量直接添加到root中我的.html文件中，这些文件将被呈现为页面。

但是当我在浏览器上检查这个时，我得到另一个空白菜单项，将我链接到我的main.css和framework.css文件。

这是渲染的html：

<ul class="list-inline float-right">
    <li><a href="/css/main.css"></a></li>
    <li><a href="/css/framework.css"></a></li>
    <li class="active"><a href="/">Home</a></li>
    <li><a href="/works/">Works</a></li>
    <li><a href="/blog/">Blog</a></li>
</ul>

这发生在我将main.sass和framework.sass文件包含在位于css文件夹中的Jekyll资产而_sass文件夹中的部分sass文件之后。 我假设前面的事情使得这两个sass文件被呈现为页面，这是因为我添加到我的两个sass文件中的yaml前端问题。 我试图删除它们顶部的双---线然后我刷新localhost和空白菜单项。

我有三个要呈现的菜单项：

• 家
• 作品
• 博客

但结果就是五个！

所以这是真的，因为yaml前面的事情？ 如何在使用Jekyll sass资产管道时修复此问题？

Answer 1

在这种情况下，您最好使用site.html_pages ：

{% assign menu_pages = site.html_pages | sort: 'index' %}

从https://jekyllrb.com/docs/variables/#site-variables ， site.html_pages是：

site.pages一个子集，列出以.html结尾的那些。

Answer 2

你的if子句在menu_title上过滤但是else子句没有过滤。 您可以将您的条件更改为：

{% if page.menu_title %}
  <li{% if page.url == p.url %} class="active">{% endif %}
    <a href="{{ p.url | prepend: site.baseurl }}">{{ p.menu_title }}</a>
  </li>
{% endif %}