JustinWDev of Archived Theme Support
5/20/2015 - 3:25 PM

Add pagination that features First, Previous, 3 numbered pages, Next, and Last. The styling of the links changes per theme, but the function

Add pagination that features First, Previous, 3 numbered pages, Next, and Last. The styling of the links changes per theme, but the functionality is here.

{% comment %} 
if you want to always show the first and last page as a number if it's within 2 of the current page
replace the loop in the pagination.liquid snippet above with this loop.
{% endcomment %}

  {% for part in paginate.parts %}
      <!-- part title is {{ part.is_link }} current page is {{ paginate.current_page }} -->
    {% if part.is_link %}  
      {% if part.url == first.url and paginate.current_page <=3 %}
        <li>
          <a href="{{ part.url }}" title="">{{ part.title }}</a>
        </li>
      {% elsif part.url == last.url and pages_left <= 2 %}
        <li>
          <a href="{{ part.url }}" title="">{{ part.title }}</a>
        </li>
      {% elsif part.url != first.url and part.url != last.url %}
        <li>
          <a href="{{ part.url }}" title="">{{ part.title }}</a>
        </li>
      {% endif %}
    {% else %}
      {% if part.title == paginate.current_page %}
        <li class="active"><span>{{ part.title }}</span></li>
      {% endif %}
    {% endif %}
  {% endfor %}
<ul class="pagination clearfix">
  {% assign first = paginate.parts | first %}
  {% assign last = paginate.parts | last %}
  {% if paginate.previous %}
    <li><a href="{{ first.url }}" title=""><<</a></li>
    <li><a href="{{ paginate.previous.url }}" title="{{ paginate.previous.title }}"><</a></li>
  {% else %}
    <li class="disabled"><span><<</span></li>
  <li class="disabled"><span><</span></li>
  {% endif %}
  
  {% for part in paginate.parts %}
    {% if part.is_link %}
      {% unless part.url == last.url or part.url == first.url %}
        <li>
          <a href="{{ part.url }}" title="">{{ part.title }}</a>
        </li>
      {% endunless %}
    {% else %}
      {% if part.title == paginate.current_page %}
        <li class="active"><span>{{ part.title }}</span></li>
      {% endif %}
    {% endif %}
  {% endfor %}

  {% if paginate.next %}
    <li><a href="{{ paginate.next.url }}" title="{{ paginate.next.title }}">></a></li>
    <li><a href="{{ last.url }}" title="">>></a></li>
  {% else %}
    <li class="disabled"><span>></span></li>
    <li class="disabled"><span>>></span></li>
  {% endif %}
</ul>