How to show latest posts from multiple blogs instead of one single blog

[lqz]

Hi there, we have created 4 blogs in one shopify site. Each blog has some posts, so far we have about 30 posts in total. I created a new page template with navigation links to the 4 blogs. I want this blog home page to show the latest posts with pagination, eg if I post a new post in blog A, then one post in blog B, it should show the two posts from the two different blogs in one page.

However when I add section of blog posts, I can only choose to show one of the blogs and I can show 4 posts at most without pagination.

I would like to know:

1) How I can group all the posts from the 4 blogs and display them in the page sort by time?

2) Since I have about 30 posts and will have more, how I can add pagination in the page?

Many thanks to your help!

[Small_Task_Help]

Hi,

You need to create custom snippet for multiple blog posts in Blog template and integrate that in theme (index.liquid)

Custom snippet code example

{%- assign blog_handles = "blog1-handle,blog2-handle,blog3-handle" | split: "," -%}
{%- assign articles = "" | split: "" -%}

{%- for handle in blog_handles -%}
  {%- assign blog = blogs[handle] -%}
  {%- for article in blog.articles limit: 5 -%}
    {%- assign articles = articles | push: article -%}
  {%- endfor -%}
{%- endfor -%}

{%- assign sorted_articles = articles | sort: 'published_at' | reverse -%}

<div class="multi-blog-posts">
  {%- for article in sorted_articles limit: 5 -%}
    <div class="article">
      <h3><a href="{{ article.url }}">{{ article.title }}</a></h3>
      <p>{{ article.published_at | date: "%B %d, %Y" }}</p>
      <p>{{ article.excerpt | strip_html | truncatewords: 20 }}</p>
    </div>
  {%- endfor -%}
</div>

If you still need help you can contact us