用于最小主题

Question

My blog是在Github上使用Jekyll构建的。在导航栏中，默认顺序为Pages，Messages，About，Archives。我想将列表更改为Pages，Archives，About，Messages。我该怎么办？

我认为它与下面的代码相关

{% assign pages_list = site.pages %}

我认为site.pages是我应该改变的，但我不知道如何。

Answer 1

您可以创建菜单项的自定义顺序，如下所示：

1）在您的页面前面添加订单字段（您可以在预先设置时将其命名）

---
layout: default
published: true
title: Page title
order: 1
---

2）获取网页时，请应用＆＃39;排序＆＃39;过滤

{% assign sorted_pages = site.pages | sort:"order" %}
{% for node in sorted_pages %}
  <li><a href="{{node.url}}">{{node.title}}</a></li>
{% endfor %}

根据＆＃39;订单＆＃39;您最终会得到一个有序（ASC）的网页列表。您添加到每个页面的字段值。

Answer 2

更新：某些订购功能似乎已添加到Jekyll：https://github.com/plusjade/jekyll-bootstrap/commit/4eebb4462c24de612612d6f4794b1aaaa08dfad4

更新：请查看下面安迪杰克逊的评论 - “名称”可能需要更改为“路径”。

这似乎对我有用：

{% assign sorted_pages = site.pages | sort:"name" %}
{% for node in sorted_pages %}
  <li><a href="{{node.url}}">{{node.title}}</a></li>
{% endfor %}

name是文件名。我将页面重命名为00-index.md，01-about.md等。排序工作正常，但页面是使用这些前缀生成的，这看起来很难看，特别是00-index.html。

要修复此问题，我会覆盖永久链接：

---
layout: default
title: News
permalink: "index.html"
---

可悲的是，这不适用于自定义属性，因为它们无法作为Page class上的方法访问：

{% assign sorted_pages = site.pages | sort:"weight" %} #bummer

Answer 3

导航栏菜单的顺序取决于_layout中的HTML模板（可能会从_includes中提取HTML片段。

听起来您的导航栏是使用液体代码从site.pages中提供的页面列表编程生成的

{% assign pages_list = site.pages %}

如果您只有少量页面，您可能更愿意手动编写列表。 site.pages是Jekyll所有页面的按字母顺序排列的列表。没有什么可以阻止你只是硬编码：

 <div class="navbar" id="page-top">
      <div class="navbar-inner">
        <div class="container">
          <a class="brand" href="/">EverCoding.net</a>
          <ul class="nav">
            <li><a href="/pages.html">Pages</a></li>        
        <li><a href="/archive.html">Archive</a></li>
        <li><a href="/about.html">About</a></li>
        <li><a href="/messages.html">Messages</a></li>

虽然我猜测你现在以编程方式生成了这个列表，也许是按照Jekyll-bootstrap对液体代码的处理方式：

<div class="navbar">
      <div class="navbar-inner">
        <div class="container">
          <a class="brand" href="{{ HOME_PATH }}">{{ site.title }}</a>
          <ul class="nav">
            {% assign pages_list = site.pages %}
            {% assign group = 'navigation' %}
            {% include JB/pages_list %}
          </ul>
        </div>
      </div>
    </div>

如果你真的想要每次确定菜单，第二个例子中的液体代码很方便，但是如果你有一个静态顺序的静态菜单，你可能最好像我在第一个例子中那样手工编码，而不是修改液体代码进行排序。

如果您可以链接到Jekyll来源，而不是发布的博客，我们可能会更具体。

Answer 4

我在_data目录中创建了pages.yml文件，它看起来像是类似的：

- url: pages/test.html
  title: Pages
  group: navigation
- url: pages/front.html
  title: Front
  group: navigation

我更改了default.html（从site.pages到site.data.pages）：

<ul class="nav">
  {% assign pages_list = site.data.pages %}
  {% assign group = 'navigation' %}
  {% include JB/pages_list %}
</ul>

现在我可以将这个yml文件用于菜单。

Answer 5

您可以看到文档：http://jekyll.tips/jekyll-casts/navigation/

navigation_weight 有很好的示例和解释。

---
layout: page
title: About
permalink: /about/
navigation_weight: 10
---

对于极小值：

<div>
     {% assign navigation_pages = site.pages | sort: 'navigation_weight' %}
        {% for p in navigation_pages %}
          {% if p.navigation_weight %}
            {% if p.title %}
            <a class="page-link" href="{{ p.url | relative_url }}">{{ p.title | escape }}</a>
            {% endif %}
          {% endif %}
        {% endfor %}
      </div>

Answer 6

我正在使用Jekyll v2.5.3，你也可以为你的实际降价文件编号（按照这种方式排序），因为你正在使用Front Matter块，你仍然可以保留你想要的标题和永久链接。 / p>

解析器会以这种方式订购您的页面链接即：

01_about.md
02_photos.md
03_projects.md
99_contact.md

Answer 7

你是在正确的道路上。您可以按名称自定义变量排序，例如，＆＃39; order＆＃39;。

在header.html插入和额外行中：

server:
    port: ${PORT:8085}

然后用for语句中的pages_list替换site.pages：

{% assign pages_list = (site.pages | sort: 'order') %}

然后添加＆＃39; order＆＃39;进入每页的YAML前端，并设置一个合适的值：

{% for my_page in pages_list %}
   {% if my_page.title %}
      <a class="page-link" href="{{ my_page.url | relative_url }}">{{ my_page.title | escape }}</a>
   {% endif %}
{% endfor %}

Answer 8

Jekyll Bootstrap 3模板要求您在Jekyll标头中包含group navigation。在@ Wojtek的答案的基础上，您可以修改JB3's pages_list以使用此group字段进行过滤和排序。

在调用pages_list之前，按组排序：

{% assign sorted_pages = site.pages | sort:"group" %}

然后，只需更改pages_list中的一行：

{% if group == null or group == node.group %} - ＆gt; {% if group == null or node.group contains group %}

现在，您可以将该组指定为navigation-00，navigation-01，而无需重命名文件或设置任何永久链接，并且您可以免费进行排序。

Answer 9

我前段时间simple plugin根据SELECT ... FROM T1 JOIN T2 ON T1.serial = T2.serial AND CASE T1.field WHEN 'xx' THEN T2.xx WHEN 'yy' THEN T2.yy WHEN 'zz' THEN T2.zz END ...数组对页面进行排序，您可以定义page_order：

_config.yml

它在模板中公开pages_order: ['index', 'summary', 'overview', 'part1', 'part2', 'conclusion', 'notes']和page.prev以允许导航：

page.next

注意：在Github Pages上不起作用。

Answer 10

用于最小主题

输入：

header_pages:
 - pages.md
 - archive.md
 - about.md
 - messages.md

_config.yml中的

覆盖默认顺序。就是这样。

最低自述文件：

自定义导航链接

这使您可以设置要显示在页面中的页面。   导航区域并配置链接的顺序。

例如，要仅链接到about和portfolio页面，   向您_config.yml添加以下内容：
  - about.md
  - portfolio.md

您可以通过最低_includes在header.html文件中查看其工作原理。

如何更改Jekyll中的默认订单页面？

10 个答案:

用于最小主题

自定义导航链接