pagination - 液体和算术

Question

我正在处理一些分页，我想知道是否有办法告诉液体只显示 5 页。我正在寻找的输出是

<< 前 5 6 7 8 9 最后 >>

我目前采用的逻辑有效，但它显示了所有 30 个页面。

{% for count in (2..paginator.total_pages) %}
    {% if count == paginator.page %}
        <span class="current">{{ count }}</span>
    {% else %}
        <a href="/page/{{ count }}/" class="pagenavi-page" title="{{ count }}">{{ count }}</a>
    {% endif %}
{% endfor %}

我希望能够使 2 和 paginator.total_pages 成为动态的，我已经尝试过

{% for count in ((paginator.page - 2)..(paginator.page + 2)) %} 

然而，这段代码实际上并没有做数学运算，如果 paginator.page = 5 那么循环是 5..5 并且不提供预期的结果。我可以弄清楚逻辑，使其不会达到负数并按预期工作，但是我该如何做数学方程式呢？

Answer 1

您需要使用过滤器paginator.total_pages来进行算术运算，然后使用capture标签将结果捕获到变量中。一旦有了开始页和结束页，就可以for像往常一样编写循环：

{% capture page_start %}{{ paginator.page | minus: 2 }}{% endcapture %}
{% capture page_end %}{{ paginator.page | plus: 2 }}{% endcapture %}

{% for count in (page_start..page_end) %}
     {% comment %} ... do your thing ... {% endcomment %}
{% endfor %}

Answer 2

我正在用 Jekyll 建立一个博客，我也遇到过类似的情况。根据我在Liquid wikilimit中发现的内容，可以使用and遍历给定集合的子集offset。

以下示例反映了您的特定情况，并且应该在从第一页到最后一页的每一页中都能正常工作：

{% capture start %}{{ paginator.page | minus: 3 }}{% endcapture %}

{% for i in (1..paginator.total_pages) limit: 5 offset: start %}
    ...
{% endfor %}

Answer 3

我正在为我的网站使用 Bootstrap 3.0.3。我使用以下代码进行分页。它具有您正在寻找的相同效果。我在上面发布的代码是您正在寻找的，但无论如何我都会在这里发布我的引导分页代码。

{% if paginator.total_pages != 1 %} 
{% if paginator.total_pages < 7 %}
        <div class="page-body col-md-12">
          <ul class="pagination pagination-centered">
            {% if paginator.total_pages >= 10 %} 
            {% if paginator.previous_page %}
                <li>
                  <a href="{{ site.url }}/">&laquo;&laquo;</a>
                </li>
            {% else %}
              <li class="disabled">
                <a>&laquo;&laquo;</a>
              </li>
            {% endif %}
            {% endif %}
            {% if paginator.previous_page %}
              {% if paginator.previous_page == 1 %}
                <li>
                  <a href="{{ site.url }}/">&laquo;</a>
                </li>
              {% else %}
                <li>
                  <a href="{{ site.url }}/page{{paginator.previous_page}}">&laquo;</a>
                </li>
              {% endif %}
            {% else %}
              <li class="disabled">
                <a>&laquo;</a>
              </li>
            {% endif %}
            {% if paginator.page == 1 %}
              <li class="active">
                <a>1</a>
              </li>
            {% else %}
              <li>
                <a href="{{ site.url }}/">1</a>
              </li>
            {% endif %}
            {% for count in (2..paginator.total_pages) %}
              {% if count == paginator.page %}
                <li class="active">
                  <a>{{count}}</a>
                </li>
              {% else %}
                <li>
                  <a href="{{ site.url }}/page{{count}}">{{count}}</a>
                </li>
              {% endif %}
            {% endfor %}
            {% if paginator.next_page %}
              <li>
                <a href="{{ site.url }}/page{{paginator.next_page}}">&raquo;</a>
              </li>
            {% else %}
              <li class="disabled">
                <a>&raquo;</a>
              </li>
            {% endif %}
            {% if paginator.total_pages >= 10 %} 
            {% if paginator.next_page %}
              <li>
                <a href="{{ site.url }}/page{{paginator.total_pages}}">&raquo;&raquo;</a>
              </li>
            {% else %}
              <li class="disabled">
                <a>&raquo;&raquo;</a>
              </li>
            {% endif %}
            {% endif %}
          </ul>
        </div>
{% else %}

{% assign page_start = paginator.page | minus: 2 %}
{% assign page_end = paginator.page | plus: 2 %}
{% if page_end > paginator.total_pages %}
{% assign page_end = paginator.total_pages %}
{% assign page_start = paginator.page | minus: 4 %}
{% endif %}
{% if page_start < 2 %}
{% assign page_end = paginator.page | plus: 3 %}
{% assign page_start = paginator.page | minus: 1 %}
{% endif %}
{% if page_start == 0 %}
{% assign page_end = paginator.page | plus: 4 %}
{% assign page_start = paginator.page %}
{% endif %}

<div class="page-body col-md-12">
    <ul class="pagination pagination-centered">
    {% if paginator.total_pages > 5 %} 
    {% if paginator.previous_page %}
        <li>
          <a href="{{ site.url }}/">&laquo;&laquo;</a>
        </li>
    {% else %}
      <li class="disabled">
        <a>&laquo;&laquo;</a>
      </li>
    {% endif %}
    {% endif %}
    {% if paginator.previous_page %}
      {% if paginator.previous_page == 1 %}
        <li>
          <a href="/">&laquo;</a>
        </li>
      {% else %}
        <li>
          <a href="/page{{paginator.previous_page}}">&laquo;</a>
        </li>
      {% endif %}
    {% else %}
      <li class="disabled">
        <a href="#">&laquo;</a>
      </li>
    {% endif %}
    {% if page_start == 1 %}
    {% assign page_end = paginator.page | plus: 4 %}
    {% assign page_start = 2 %}
    {% if paginator.page == 1 %}
      <li class="active">
        <a href="#">1</a>
      </li>
    {% else %}
      <li>
        <a href="/">1</a>
      </li>
    {% endif %}
    {% endif %}
    {% for count in (page_start..page_end) %}
      {% if count == paginator.page %}
        <li class="active">
          <a href="#">{{count}}</a>
        </li>
      {% else %}
        <li>
          <a href="/page{{count}}">{{count}}</a>
        </li>
      {% endif %}
    {% endfor %}
    {% if paginator.next_page %}
      <li>
        <a href="/page{{paginator.next_page}}">&raquo;</a>
      </li>
    {% else %}
      <li class="disabled">
        <a href="#">&raquo;</a>
      </li>
    {% endif %}
    {% if paginator.total_pages > 5 %} 
    {% if paginator.next_page %}
      <li>
        <a href="{{ site.url }}/page{{paginator.total_pages}}">&raquo;&raquo;</a>
      </li>
    {% else %}
      <li class="disabled">
        <a>&raquo;&raquo;</a>
      </li>
    {% endif %}
    {% endif %}
  </ul>
</div>
{% endif %}
{% endif %}

Answer 4

试试这个

{% if paginator.total_pages < 7 %}
{% if paginator.page == 1 %}
        <span class="current bold">1</span>
{% else %}
        <a href="{{ site.url }}/">1</a>
{% endif %}
{% for count in (2..paginator.total_pages) %}
    {% if count == paginator.page %}
        <span class="current bold">{{ count }}</span>
    {% else %}
        <a href="/page{{ count }}/" class="pagenavi-page" title="{{ count }}">{{ count }}</a>
    {% endif %}
{% endfor %}
{% else %}
{% assign page_start = paginator.page | minus: 2 %}
{% assign page_end = paginator.page | plus: 2 %}
{% if page_end > paginator.total_pages %}
{% assign page_end = paginator.total_pages %}
{% assign page_start = paginator.page | minus: 4 %}
{% endif %}
{% if page_start < 2 %}
{% assign page_end = paginator.page | plus: 3 %}
{% assign page_start = paginator.page | minus: 1 %}
{% endif %}
{% if page_start == 0 %}
{% assign page_end = paginator.page | plus: 4 %}
{% assign page_start = paginator.page %}
{% endif %}
{% if page_start == 1 %}
{% assign page_end = paginator.page | plus: 4 %}
{% assign page_start = 2 %}
{% if paginator.page == 1 %}
        <span class="current bold">1</span>
{% else %}
        <a href="{{ site.url }}/">1</a>
{% endif %}
{% endif %}
{% for count in (page_start..page_end) %}
    {% if count == paginator.page %}
        <span class="current bold">{{ count }}</span>
    {% else %}
        <a href="/page{{ count }}/" class="pagenavi-page" title="{{ count }}">{{ count }}</a>
    {% endif %}
{% endfor %} 
{% endif %}