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

Question

我的博客是在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)获取页面时,应用"排序"过滤器

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

根据您添加到每个页面的"订单"字段值,您最终会得到一个有序(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类上的方法访问:

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

Answer 3

导航栏菜单的顺序由HTML模板决定_layout(可能是从中提取HTML片段)_includes.

听起来您的导航栏是使用液体代码从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块，因此仍可以按需要保留标题和永久链接。

解析器将以这种方式对页面链接进行排序。
即：

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