Hubspot Blog Numbered Pagination

Hubspot Blog Numbered Pagination.html

{% if contents.total_page_count > 1 %}
  <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>
{% endif %}