Pagination of multiple recent post blog

<div class="blog-section">
  <div class="blog-listing-wrapper cell-wrapper">
    <div class="post-listing clearfix">
      {% set blog_one_posts = blog_recent_posts('6126215542', 200) %} <!-- sets a variable for a the 5 most recent posts of my default COS blog -->
      {% set blog_two_posts = blog_recent_posts('6126300566', 200) %}  <!-- sets a variable for a the 5 most recent posts of my blog id 47082700. You can find the blog id in the URL of the blog dashboard for a particular blog-->
      {% set blog_three_posts = blog_recent_posts('6130453958', 200) %}
      {% set blog_four_posts = blog_recent_posts('6131348719', 200) %}
      {% set all_posts = (blog_one_posts + blog_two_posts + blog_three_posts + blog_four_posts) | sort(true, false, 'publish_date')  %} <!-- combines the two variables into a single variable and sorts them by publish date. Please note the sort filter requires all three parameters -->

      {% set page_size = 12 %} {# Define Page Size Here #}
      {% set rowCount = all_posts|length %}
      {% set pageCount =(rowCount/page_size)|round(0, 'ceil') %}
      {% if request.query_dict.page %}
      {% set page_num = request.query_dict.page|int %}
      {% else %}
      {% set page_num = 1 %}
      {% endif %}
      {% set offsetNum = (page_num-1)*page_size  %}
      {% set endIndex = offsetNum + page_size + 1 %}

      {% set productsList = all_posts %}
      {% for post in all_posts %}
      {% if loop.index > offsetNum and loop.index < endIndex %}
      <div class="post-item">
        <div class="blogListDateBox">
          {{ post.publish_date_local_time.strftime('%b') }} <br>{{ post.publish_date_local_time.strftime('%-m') }}
        </div>
        {% if post.post_list_summary_featured_image %}
        <div class="hs-featured-image-wrapper">
          <a href="{{post.absolute_url}}" title="" class="hs-featured-image-link">
            <img src="{{ resize_image_url( post.post_list_summary_featured_image,643 ) }}" class="hs-featured-image" alt="{{ post.featured_image_alt_text | escape }}">
          </a>
        </div>
        {% endif %}
        <div class="post-header">
          <h2><a href="{{post.absolute_url}}">{{ post.name }}</a></h2>
          <div id="hubspot-author_data" class="hubspot-editable" data-hubspot-form-id="author_data" data-hubspot-name="Blog Author">
            {{ post.parent_blog.name }}
            - Posted by
            {% if post.blog_post_author %}
            {{ post.blog_post_author.display_name }} {{ post.blog_post_author.bio }}
            {% endif %}
          </div>

        </div>
        <div class="post-body clearfix">
          <!--post summary-->
          {{ post.post_list_content|safe|striptags|truncatehtml(150) }}
        </div>
        {% if content_group.show_summary_in_listing %}
        <a class="more-link" href="{{ post.absolute_url }}">Continue Reading</a>
        {% endif %} 
      </div>
      {% endif %}
      {% endfor %}


<div class="blog-pagination clearfix">
      {% set last_page = page_num - 1 %}
      {% if page_num <= 1 %}
      {% set last_page = "" %}
      {% endif %}

      {% set next_page = page_num + 1 %}
      {% if page_num >= pageCount %}
      {% set next_page = "" %}
      {% endif %}
      <ul class="table-pagination">
        {% set page_list = [-2, -1, 0, 1, 2] %}
        {% if pageCount - page_num == 1 %}{% set offset = -1 %}
        {% elif pageCount - page_num == 0 %}{% set offset = -2 %}
        {% elif page_num == 2 %}{% set offset = 1 %}
        {% elif page_num == 1 %}{% set offset = 2 %}
        {% else %}{% set offset = 0 %}{% endif %}
        <li class="prev-link {% if not last_page %} disabled {% endif %}" >
          <a {% if last_page %} href="{{ request.path }}?page={{ last_page }}" {% endif %}>← Previous</a>
        </li>
          {% if pageCount > 5 %}
          {% if page_num >= 4 %}
          <li class="prev"><a href="{{ request.path }}?page=1">1</a></li>
          <li><a class="elipses" href="{% if page_num <= 5 %}{{ request.path }}?page=1{% else %}{{ request.path }}?page={{ page_num - 5 }}{% endif %}">...</a></li>
          {% endif %}
          {% endif %}
       
          {% for page in page_list %}
          {% set this_page = page_num + page + offset %}
          {% if this_page > 0 and this_page <= pageCount %}
          <li><a {% if this_page == page_num %}class="active"{% endif %} href="{{ request.path }}?page={{ this_page }}">{{ this_page }}</a></li>
          {% endif %}
          {% endfor %}
       
          {% if pageCount > 5 %}
          {% if pageCount - page_num > 2 %}
          <li><a class="elipses" href="{% if pageCount - page_num <= 5 %}{{ pageCount }}{% else %}{{ request.path }}?page={{ page_num + 5 }}{% endif %}">...</a></li>
          <li><a href="{{ request.path }}?page={{ pageCount }}">{{ pageCount }}</a></li>
          {% endif %}
          {% endif %}
          <li class="next {% if not next_page %} disabled{% endif %}"><a class="next-link" {% if next_page %} href="{{ request.path }}?page={{ next_page }}" {% endif %}>Next →</a>
       
      </ul>
      </div>
    </div>
  </div>
</div>

Comments

Post a Comment

Popular posts from this blog

Js Code

Service Filter