html - 在 Jekyll 中设置事件链接不起作用

Question

我试图在 Jekyll 中简单地设置我的事件链接的样式，但未能使它们正常工作。

这是我试图让他们工作的网站:http://concisecss.github.io/concise.css ，您可以在此处查看源代码:https://github.com/ConciseCSS/concise.css/tree/gh-pages .

我将这个 YAML 代码放在我的 _config.yml 中来定义我的顶级导航:

# Main Navigation
nav:
- text: Welcome
  url: /concise.css/
- text: Why Concise
  url: /concise.css/why-concise/
- text: Get Started
  url: /concise.css/get-started/
- text: Documentation
  url: /concise.css/documentation/layout/container/
- text: Add-Ons
  url: /concise.css/add-ons/

然后在我的 header.html include 中，这是我的导航所在的位置，我有:

{% for link in site.nav %}
  <li>
    <a {% if link.url == page.url %}class="active"{% endif %} href="{{ link.url }}">{{ link.text }}</a>
  </li>
{% endfor %}

但是，每当我在其中一个导航链接上时，都不会添加事件类(当您打开时，链接应该是粉红色的。

其他一切正常，所以我假设这可能只是我遇到的一个小问题。

编辑:这是我其中一个页面的首页内容:

---
layout: why-concise
title: Why Concise
permalink: /why-concise/
---

Answer 1

我刚刚在我的博客元素中做了同样的事情，还没有展示给你看，但它是这样工作的:

1. 创建一个数据文件 nav.yml 文件并在文件夹中写入您的导航文本和 URL _data .

导航.yml

- text: Welcome
  url: /concise.css/

- text: Why Concise
  url: /concise.css/why-concise/

- text: Get Started
  url: /concise.css/get-started/

- text: Documentation
  url: /concise.css/documentation/layout/container/

- text: Add-Ons
  url: /concise.css/add-ons/

2. 在您的 html 页面中，您将通过 yml 文件中的数据菜单列表创建一个循环。

{% for nav in site.data.nav %}
<li{% if nav.url == page.url %} class="active"{% endif %}><a href="{{ nav.url }}">{{ nav.text }}</a></li>
{% endfor %}

如果您在 nav.yml 中设置了 url:/concise.css/why-concise/，请记住确保您的永久链接与 nav.yml 中的内容相同，这样您的永久链接应该在前面的事情上是一样的。

---
layout: why-concise
title: Why Concise
permalink: /concise.css/why-concise/
---

更新: @Keenan 这是一个例子 http://adrianorosa.com ，我之前告诉过你。 来源可以在 https://github.com/adrianorsouza/adrianorosa.com 找到。