Shopify 集合页实现自定义广告位插入（支持分页）

{% paginate collection.products by section.settings.products_per_page %}这个分页在服务端渲染，Liquid 渲染完页面后，前端只能获取结果，无法直接修改分页逻辑。如果需要在商品列表中插入广告或推荐模块，传统做法往往需要重写分页逻辑，增加复杂度。

利用 Shopify 自带分页结合 Section block，可以轻松实现集合页广告位插入，而不需要重写分页逻辑。该方法简单、高效、易维护，可以利用分页的数量，这样就不会造成渲染错误，比如当前页12个位置，需要插入2个广告，那么就设为当前分页10个产品。那么剩余的两个位置就是广告位。这样就避免了从新写分页逻辑以及产品渲染混乱的问题

• 可按页码和位置精确定位广告

• 支持不同设备显示不同广告素材

• 不影响产品浏览流程

• 广告与产品自然融合

{%- for product in collection.products -%}{% assign current_position = forloop.index %}{% for block in section.blocks %}{% if block.settings.page == paginate.current_page and block.settings.number == current_position %}<!-- 渲染广告位 --><li class="grid__item collection-item-wrapper"><div class="collection-item">{{ block.settings.ad_content }}</div></li>{% endif %}{% endfor %}<!-- 渲染普通商品 --><li class="grid__item">{% render 'card-product', card_product: product %}</li>
{%- endfor -%}