Numbered Pagination


                           

<!-- Numbered Pagination -->
<div class="blog-pagination">
    {% set page_list = [-2, -1, 0, 1, 2] %}
    {% if contents.total_page_count - current_page_num == 1 %}{% set offset = -1 %}
    {% elif contents.total_page_count - current_page_num == 0 %}{% set offset = -2 %}
    {% elif current_page_num == 2 %}{% set offset = 1 %}
    {% elif current_page_num == 1 %}{% set offset = 2 %}
    {% else %}{% set offset = 0 %}{% endif %}

    <div class="blog-pagination-left">
        {% if last_page_num %}<a class="prev-link" href="{{ blog_page_link(last_page_num) }}">❮</a>{% endif %}
        {% if contents.total_page_count > 5 %}
            {% if current_page_num >= 4 %}
                <a href="{{ blog_page_link(1) }}">1</a>
                <a class="elipses" href="{% if current_page_num <= 5 %}{{ blog_page_link(1) }}{% else %}{{ blog_page_link(current_page_num - 5) }}{% endif %}">...</a>
            {% endif %}
        {% endif %}
    </div>
    <div class="blog-pagination-center">
        {% for page in page_list %}
            {% set this_page = current_page_num + page + offset %}
            {% if this_page > 0 and this_page <= contents.total_page_count %}
                <a {% if this_page == current_page_num %}class="active"{% endif %} href="{{ blog_page_link(this_page) }}">{{ this_page }}</a>
            {% endif %}
        {% endfor %}
    </div>
    <div class="blog-pagination-right">
        {% if contents.total_page_count > 5 %}
            {% if contents.total_page_count - current_page_num > 2 %}
                <a class="elipses" href="{% if contents.total_page_count - current_page_num <= 5 %}{{ contents.total_page_count }}{% else %}{{ blog_page_link(current_page_num + 5) }}{% endif %}">...</a>
                <a href="{{ blog_page_link(contents.total_page_count) }}">{{ contents.total_page_count }}</a>
            {% endif %}
        {% endif %}
        {% if next_page_num %}<a class="next-link" href="{{ blog_page_link(current_page_num + 1) }}">❯</a>{% endif %}
    </div>
</div>

                   

Comments

Popular posts from this blog

Pagination of multiple recent post blog

Service Filter

When You Want to open popup(first time load)