分頁功能

對于大多數(shù)網(wǎng)站（尤其是博客），當文章越來越多的時候，就會有分頁顯示文章列表的需求。 Jekyll 已經(jīng)自建 分頁功能，你只需要根據(jù)約定放置文件即可。

分頁功能只支持 HTML 文件

Jekyll 的分頁功能不支持 Markdown 或 Textile 文件，而是只支持 HTML 文件。當然，這不會讓 你不爽。

開啟分頁功能

開啟分頁功能很簡單，只需要在 _config.yml 里邊加一行，并填寫每頁需要幾行：

paginate: 5

下邊是對需要帶有分頁頁面的配置：

paginate_path: "blog/page:num"

blog/index.html將會讀取這個設置，把他傳給每個分頁頁面，然后從第2 頁開始輸出到 blog/page:num， :num 是頁碼。如果有 12 篇文章并且做如下配置 paginate: 5， Jekyll 會將前 5 篇文章寫入 blog/index.html ，把接下來的 5 篇文章寫入 blog/page2/index.html，最后 2 篇寫入 blog/page3/index.html。

與 paginator 相同的屬性

http://wiki.jikexueyuan.com/project/jekyll/images/15.png" alt="" />

不支持對“標簽”和“類別”分頁

分頁功能僅僅遍歷文章列表并計算出結(jié)果，并無讀取 YAML 頭信息，現(xiàn)在不支持對“標簽”和“類別”分頁。

生成帶分頁功能的文章

接下來要做的事情就是展現(xiàn)在頁面上了，下邊是一個簡單的例子：

---
layout: default
title: My Blog
---

<!-- 遍歷分頁后的文章 -->
{% for post in paginator.posts %}
  <h1><a href="{{ post.url }}">{{ post.title }}</a></h1>
  <p class="author">
    <span class="date">{{ post.date }}</span>
  </p>
  <div class="content">
    {{ post.content }}
  </div>
{% endfor %}

<!-- 分頁鏈接 -->
<div class="pagination">
  {% if paginator.previous_page %}
    <a href="/page{{ paginator.previous_page }}" class="previous">Previous</a>
  {% else %}
    <span class="previous">Previous</span>
  {% endif %}
  <span class="page_number ">Page: {{ paginator.page }} of {{ paginator.total_pages }}</span>
  {% if paginator.next_page %}
    <a href="/page{{ paginator.next_page }}" class="next">Next</a>
  {% else %}
    <span class="next ">Next</span>
  {% endif %}
</div>

注意首尾頁

Jekyll 沒有生成文件夾 ‘page1’ ，所以上邊的代碼有 bug ，下邊的代碼解決了這個問題。 下邊的 HTML 片段是第一頁，他除自己外，為每個頁面生成了鏈接。

{% if paginator.total_pages > 1 %}
<div class="pagination">
  {% if paginator.previous_page %}
    <a href="{{ paginator.previous_page_path | prepend: site.baseurl | replace: '//', '/' }}">&laquo; Prev</a>
  {% else %}
    <span>&laquo; Prev</span>
  {% endif %}

  {% for page in (1..paginator.total_pages) %}
    {% if page == paginator.page %}
      <em>{{ page }}</em>
    {% elsif page == 1 %}
      <a href="{{ '/index.html' | prepend: site.baseurl | replace: '//', '/' }}">{{ page }}</a>
    {% else %}
      <a href="{{ site.paginate_path | prepend: site.baseurl | replace: '//', '/' | replace: ':num', page }}">{{ page }}</a>
    {% endif %}
  {% endfor %}

  {% if paginator.next_page %}
    <a href="{{ paginator.next_page_path | prepend: site.baseurl | replace: '//', '/' }}">Next &raquo;</a>
  {% else %}
    <span>Next &raquo;</span>
  {% endif %}
</div>
{% endif %}