Skip to content

Instantly share code, notes, and snippets.

@raihan004
Forked from kyleaparker/gist:7588995
Last active August 14, 2018 23:44
Show Gist options
  • Save raihan004/9b274c905379b117c314a2429dee2937 to your computer and use it in GitHub Desktop.
Save raihan004/9b274c905379b117c314a2429dee2937 to your computer and use it in GitHub Desktop.
Shopify: Show all numbers in pagination
<nav aria-label="Page navigation example">
<ul class="pagination">
<li class="page-item {% unless paginate.previous.is_link %} disabled {% endunless %}">
<a class="page-link" href="{{ paginate.previous.url }}" aria-label="Previous">
<span aria-hidden="true">&laquo;</span>
<span class="sr-only">{{ 'general.pagination.previous' | t }}</span>
</a>
</li>
{% assign count = paginate.pages %}
{% for part in paginate.parts %}
{% if part.is_link %}
<li class="page-item {% if paginate.current_page == part %} active {% endif %}">
<a class="page-link" href="{{ part.url }}">
{{ part.title }}
</a>
</li>
{%- else -%}
<li class="page-item {% if paginate.current_page %} active {% endif %}">
<a class="page-link disabled " href="#">
{{ part.title }}
</a>
</li>
{% endif %}
{% endfor %}
<li class="page-item {% unless paginate.next.is_link %} disabled {% endunless %}">
<a class="page-link" href="{{ paginate.next.url }}" aria-label="Next">
<span aria-hidden="true">&raquo;</span>
<span class="sr-only">{{ 'general.pagination.next' | t }}</span>
</a>
</li>
</ul>
</nav>
{% assign count = paginate.pages %}
{% for part in (1..count) %}
<li {% if paginate.current_page == part %}class="active"{% endif %}><a href="{{ collection.url }}?page={{ forloop.index }}">{{ forloop.index }}</a></li>
{% endfor %}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment