web-dev-qa-db-ja.com

Jekyllでデフォルトの注文ページを変更する方法は？

私のブログ はGithubのJekyllで構築されています。ナビゲーションバーのデフォルトの順序は、ページ、メッセージ、バージョン情報、アーカイブです。リストをページ、アーカイブ、情報、メッセージに変更したい。私は何をすべきか？

以下のコードに関連すると思います

{% assign pages_list = site.pages %}

おもう site.pagesは私が変更すべきものですが、その方法はわかりません。

jekyllgithub-pages
50
Ever

ナビゲーションバーメニューの順序は、_layoutのHTMLテンプレートによって決定されます（これは_includesからHTMLフラグメントを取り込む可能性があります。

あなたのnavbarは、リキッドコードを使用して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>

この2番目の例の液体コードは、毎回メニューを決定したい場合に便利ですが、静的な順序で静的メニューがある場合は、おそらく液体を変更するのではなく、最初の例のように手でコーディングするのが最善ですソートするコード。

公開されているブログではなく、Jekyllのソースにリンクできる場合は、より具体的にすることができます。

18
cboettig

次のように、メニュー項目のカスタムオーダーを作成できます。

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 %}

各ページに追加した「order」フィールドの値に基づいて、ページの順序付き（ASC）リストが作成されます。

111
Victor Stegaru

更新：いくつかの注文機能が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などに変更しました。並べ替えは機能しましたが、これらのプレフィックスを使用してページが生成されました。

これを修正するには、パーマリンクをオーバーライドします。

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

悲しいことに、これはカスタム属性では機能しません。Pageクラスのメソッドとしてアクセスできないためです。

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

_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ファイルをメニューに使用できます。

8
Ámon Tamás

ドキュメントを見ることができます： 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>
7
mariope

私はJekyll v2.5.3を使用していますが、実際のマークダウンファイルに番号を付けることもできます（そのように並べます）。FrontMatterブロックを使用しているため、タイトルとパーマリンクを必要に応じて保持できます。

パーサーは、ページリンクをそのように並べます。
つまり：

01_about.md
02_photos.md
03_projects.md
99_contact.md
5
Gerben Jacobs

あなたは正しい道にいた。たとえば、「order」という名前のカスタム変数で並べ替えることができます。

Header.htmlの挿入と追加行：

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

次に、forステートメントでsite.pagesをpages_listに置き換えます。

{% 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 %}

次に、各ページのYAMLフロントマターに「順序」を追加し、適切な値を設定します。

---
layout: page
title: About
permalink: /about/
order: 0
---
3
Laszlo

Jekyll Bootstrap テンプレートでは、Jekyllヘッダーにgroup navigationを含める必要があります。@ Wojtekの答えに基づいて、変更できます JB3's pages_list このgroupフィールドを使用して、フィルタリングとソートの両方を行います。

Pages_listを呼び出す前に、グループでソートします。

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

次に、pages_listの1行を変更します。

{% if group == null or group == node.group %}-> {% if group == null or node.group contains group %}

これで、ファイル名を変更したりパーマリンクを設定したりせずに、グループをnavigation-00、navigation-01に指定でき、無料で並べ替えができます。

2
Jeff Brateman

page_order配列に従ってページをソートするために シンプルなプラグインを作成しました_config.yml：

pages_order: ['index', 'summary', 'overview', 'part1', 'part2', 'conclusion', 'notes']

テンプレートでpage.prevおよびpage.nextを公開して、ナビゲーションを可能にします。

{% if page.prev %}
 <a id="previous-page" href="{{page.prev}}.html">Previous</a>
{% endif %}

{% if page.next %}
 <a id="next-page" href="{{page.next}}.html">Next</a>
{% endif %}

注：Githubページでは機能しません。

0
Marc