How to Create pagination in blog

Occasional Contributor
 
Reply
0 Upvotes
3 Replies 3
rio
Occasional Contributor

Just paste this code on blog listing page:

 

{% set total_pages = contents.total_page_count %} <!-- sets variable for total pages -->
{% set more_pages = total_pages - current_page_num %} <!-- sets variable for how many more pages are past the current pages -->
{% if total_pages > 1 %}
<nav>
  <ul class="pagination">
<li class="{% if current_page_num == 1 %}disabled{% endif %}"><a href="{% if last_page_num=="1" %}{{ group.absolute_url }}{% else %}{{blog_page_link(last_page_num)}}{% endif %}"><i class="fa fa-angle-double-left"></i></a></li>
                        
{% if more_pages == 0 %}
    {% if current_page_num - 4 == 1 %}<li><a href="{{ group.absolute_url }}">{{ current_page_num - 4 }}</a></li>{% endif %}
    {% if current_page_num - 4 > 1 %}<li><a href="{{ blog_page_link(current_page_num - 4) }}">{{ current_page_num - 4 }}</a></li>{% endif %}
{% endif %}
{% if more_pages <= 1 %}
    {% if current_page_num - 3 == 1 %}<li><a href="{{ group.absolute_url }}">{{ current_page_num - 3 }}</a></li>{% endif %}
    {% if current_page_num - 3 > 1 %}<li><a href="{{ blog_page_link(current_page_num - 3) }}">{{ current_page_num - 3 }}</a></li>{% endif %}
{% endif %}
{% if current_page_num - 2 == 1 %}<li><a href="{{ group.absolute_url }}">{{ current_page_num - 2 }}</a></li>{% endif %}
{% if current_page_num - 2 > 1 %}<li><a href="{{ blog_page_link(current_page_num - 2) }}">{{ current_page_num - 2 }}</a></li>{% endif %}
{% if current_page_num - 1 == 1 %}<li><a href="{{ group.absolute_url }}">{{ current_page_num - 1 }}</a></li>{% endif %}
{% if current_page_num - 1 > 1 %}<li><a href="{{ blog_page_link(current_page_num - 1) }}">{{ current_page_num - 1 }}</a></li>{% endif %}
<li class="active"><a href="{% if current_page_num==1 %}{{ group.absolute_url }}{% else %}{{ blog_page_link(current_page_num) }}{% endif %}">{{ current_page_num }}</a></li>
{% if current_page_num + 1 <= total_pages %}<li><a href="{{ blog_page_link(current_page_num + 1) }}">{{ current_page_num + 1 }}</a></li>{% endif %}
{% if current_page_num + 2 <= total_pages %}<li><a href="{{ blog_page_link(current_page_num + 2) }}">{{ current_page_num + 2 }}</a></li>{% endif %}
{% if current_page_num <= 2 %}
    {% if current_page_num + 3 <= total_pages %}<li><a href="{{ blog_page_link(current_page_num + 3) }}">{{ current_page_num + 3 }}</a></li>{% endif %}
{% endif %}
{% if current_page_num == 1 %}
    {% if current_page_num + 4 <= total_pages %}<li><a href="{{ blog_page_link(current_page_num + 4) }}">{{ current_page_num + 4 }}</a></li>{% endif %}
{% endif %}
<li class="{% if current_page_num == total_pages %}disabled{% endif %}"><a href="{{blog_page_link(next_page_num)}}"><i class="fa fa-angle-double-right"></i></a></li>
</ul>
</nav>
{% endif %} 

 

Regular Contributor

There is a problem when the url contain topic or author link.

The button (link) with page 1 returns to the general link of the blog instead of the initial page of the topic or author.

 

 

Reply
0 Upvotes
Highlighted
Regular Contributor

Just replace with this code

<div class="blog-pagination span12">
{% set total_pages = contents.total_page_count %} <!-- sets variable for total pages -->
{% set more_pages = total_pages - current_page_num %} <!-- sets variable for how many more pages are past the current pages -->
{% if total_pages > 1 %}

<ul class="pagination">
<li class="{% if current_page_num == 1 %}disabled{% endif %}"><a href="{% if last_page_num=="1" %}{{ group.absolute_url }}{% else %}{{blog_page_link(last_page_num)}}{% endif %}"><i class="fa fa-angle-double-left"></i></a></li>

{% if more_pages == 0 %}
{% if current_page_num - 4 == 1 %}<li><a href="{{ blog_page_link(current_page_num - 4)|replace('/page/1', '') }}">{{ current_page_num - 4 }}</a></li>{% endif %}
{% if current_page_num - 4 > 1 %}<li><a href="{{ blog_page_link(current_page_num - 4) }}">{{ current_page_num - 4 }}</a></li>{% endif %}
{% endif %}
{% if more_pages <= 1 %}
{% if current_page_num - 3 == 1 %}<li><a href="{{ blog_page_link(current_page_num - 3)|replace('/page/1', '') }}">{{ current_page_num - 3 }}</a></li>{% endif %}
{% if current_page_num - 3 > 1 %}<li><a href="{{ blog_page_link(current_page_num - 3) }}">{{ current_page_num - 3 }}</a></li>{% endif %}
{% endif %}
{% if current_page_num - 2 == 1 %}<li><a href="{{ blog_page_link(current_page_num - 2)|replace('/page/1', '') }}">{{ current_page_num - 2 }}</a></li>{% endif %}
{% if current_page_num - 2 > 1 %}<li><a href="{{ blog_page_link(current_page_num - 2) }}">{{ current_page_num - 2 }}</a></li>{% endif %}
{% if current_page_num - 1 == 1 %}<li><a href="{{ blog_page_link(current_page_num - 1)|replace('/page/1', '') }}">{{ current_page_num - 1 }}</a></li>{% endif %}
{% if current_page_num - 1 > 1 %}<li><a href="{{ blog_page_link(current_page_num - 1) }}">{{ current_page_num - 1 }}</a></li>{% endif %}
<li class="active"><a href="{% if current_page_num==1 %}{{ group.absolute_url }}{% else %}{{ blog_page_link(current_page_num) }}{% endif %}">{{ current_page_num }}</a></li>
{% if current_page_num + 1 <= total_pages %}<li><a href="{{ blog_page_link(current_page_num + 1) }}">{{ current_page_num + 1 }}</a></li>{% endif %}
{% if current_page_num + 2 <= total_pages %}<li><a href="{{ blog_page_link(current_page_num + 2) }}">{{ current_page_num + 2 }}</a></li>{% endif %}
{% if current_page_num <= 2 %}
{% if current_page_num + 3 <= total_pages %}<li><a href="{{ blog_page_link(current_page_num + 3) }}">{{ current_page_num + 3 }}</a></li>{% endif %}
{% endif %}
{% if current_page_num == 1 %}
{% if current_page_num + 4 <= total_pages %}<li><a href="{{ blog_page_link(current_page_num + 4) }}">{{ current_page_num + 4 }}</a></li>{% endif %}
{% endif %}
<li class="{% if current_page_num == total_pages %}disabled{% endif %}"><a href="{{blog_page_link(next_page_num)}}"><i class="fa fa-angle-double-right"></i></a></li>
</ul>

{% endif %}
</div>