Shopify合并多博客文章数组后Liquid分页提示不可分页的问题

Shopify 原生 Liquid 的 paginate 标签存在硬编码的白名单校验规则，仅对平台内置的可分页对象生效——比如单个博客的文章集合、商品集合、搜索结果这类系统直接输出的源数据。通过 concat 拼接多个博客文章生成的自定义动态数组，不在系统认可的可分页列表范围内，因此会触发不可分页的报错。

跨多博客合并文章做分页，最靠谱的方式是绕开原生paginate对自定义数组的限制，手动实现分页切片逻辑，全程不会触发平台校验错误：

• 修正初始变量赋值逻辑，避免类型混乱：原代码将featuredArticles初始值设为布尔值false，后续赋值、拼接数组的过程中会反复切换变量类型，容易触发Liquid运行异常，直接初始化为空数组即可。
• 保留已有的多博客文章合并、按发布时间倒序排序的核心逻辑，这部分逻辑本身没有问题。
• 手动计算分页参数，对排序完成的文章数组做切片，输出当前页需要展示的内容，同时替换原来依赖原生paginate输出变量的分页组件。

完整改造后的代码如下：

{% comment %} 定义需要合并的博客列表 {% endcomment %}
{% assign featuredBlogs = "All,Products,Health,Training,Nutrition" | split: "," %}
{% comment %} 初始化为空数组，替代原来的false赋值，避免类型问题 {% endcomment %}
{% assign featuredArticles = "" | split: "" %}

{% for featuredBlog in featuredBlogs %}
  {% assign blog_handle = featuredBlog | strip %}
  {% comment %} 过滤出有效博客的文章列表 {% endcomment %}
  {% if blogs[blog_handle].articles.size > 0 %}
    {% assign featuredArticles = featuredArticles | concat: blogs[blog_handle].articles %}
  {% endif %}
{% endfor %}

{% if featuredArticles.size > 0 %}
  {% comment %} 按发布时间倒序排序 {% endcomment %}
  {% assign featuredArticles = featuredArticles | sort: 'published_at' | reverse %}

  {% comment %} 手动配置分页规则：每页展示5条 {% endcomment %}
  {% assign per_page = 5 %}
  {% assign total_items = featuredArticles.size %}
  {% assign total_pages = total_items | divided_by: per_page | ceil %}
  {% comment %} 从URL参数获取当前页码，默认第一页 {% endcomment %}
  {% assign current_page = request.params.page | default: 1 %}
  {% assign current_page = current_page | times: 1 %}
  {% assign offset = current_page | minus: 1 | times: per_page %}
  {% assign end_index = offset | plus: per_page | minus: 1 %}

  {% comment %} 切片取当前页要展示的文章列表 {% endcomment %}
  {% assign current_page_articles = featuredArticles[offset..end_index] %}

  {% for article in current_page_articles %}
    <a href="{{ article.url }}" class="article-preview">
      <div class="article-pi-wrap">
        <img src="{{ article.image | img_url: 'medium' }}" />
      </div>
      <div class="ap-bottom">
        <h5 class="ap-title">{{ article.title }}</h5>
        <p class="ap-excerpt">
          <span>{{ article.published_at | date: format: 'abbreviated_date' }}</span>
        </p>
      </div>
    </a>
  {% endfor %}

  {% comment %} 手动生成分页导航，替代原来的{% include "pagination" %} {% endcomment %}
  <nav class="custom-pagination">
    {% if current_page > 1 %}
      <a href="{{ page.url }}?page={{ current_page | minus: 1 }}">上一页</a>
    {% endif %}
    <span>第 {{ current_page }} / {{ total_pages }} 页</span>
    {% if current_page < total_pages %}
      <a href="{{ page.url }}?page={{ current_page | plus: 1 }}">下一页</a>
    {% endif %}
  </nav>
{% endif %}

按照这套逻辑改造后，不会再触发自定义数组不可分页的报错，每页展示5条的效果和原生分页完全一致。

内容的提问来源于stack exchange，提问作者Yum