<nav aria-label="Page navigation"> <ul class="pagination"> {% if paginator.previous_page %} <li> <a href="{{ site.baseurl }}{{paginator.previous_page_path}}" aria-label="Previous"> <span aria-hidden="true">«</span> </a> </li> {% else %} <li class="disabled" > <a href="#" aria-label="Previous"> <span aria-hidden="true">«</span> </a> </li> {% endif %} {% if paginator.page > 4 %} <li><a href="{{ site.paginate_path | prepend: site.baseurl | replace: '//', '/' | replace: 'page:num/', '' }}">1</a></li> {% if paginator.page > 5 %} <li class="disabled" ><a href="#" >...</a></li> {% endif %} {% endif %} {% assign min_index = paginator.page | minus:3 %} {% assign max_index = paginator.page | plus:3 %} {% for p in (min_index..max_index) %} {% if p > 0 and p <= paginator.total_pages %} <li {% if p == paginator.page %} class="active" {% endif %}> {% if p == 1 %} <a href="{{ site.paginate_path | prepend: site.baseurl | replace: '//', '/' | replace: 'page:num/', '' }}">1</a> {% else %} <a href="{{ site.paginate_path | prepend: site.baseurl | replace: '//', '/' | replace: ':num', p }}">{{ p }}</a> {% endif %} </li> {% endif %} {% endfor %} {% if max_index < paginator.total_pages %} {% assign max_indexp = max_index | plus:1 %} {% if max_indexp < paginator.total_pages %} <li class="disabled" ><a href="#" >...</a></li> {% endif %} <li><a href="{{ site.paginate_path | prepend: site.baseurl | replace: '//', '/' | replace: ':num', paginator.total_pages }}">{{ paginator.total_pages }}</a></li> {% endif %} {% if paginator.next_page %} <li> <a href="{{ site.baseurl }}{{ paginator.next_page_path }}" aria-label="Next"> <span aria-hidden="true">»</span> </a> </li> {% else %} <li class="disabled" > <a href="#" aria-label="Next"> <span aria-hidden="true">»</span> </a> </li> {% endif %} </ul> </nav>