liquid - Adobe Business Catalyst 中的液体照片库模块需要分页

Question

所有图像都加载在同一页面中，我如何控制分页？ 任何人都可以帮我解决这个问题。

这是我的代码。

{module_photogallery id="123456" collection="test2016" template="" }
<div class="container">
    <div class="row">
        {% for item in test2016.items %}
        <div class="col-md-3 col-sm-3 col-xs-6">
            <a onclick="myLightbox.start(this);return false;" rel="lightbox[photo2015]" href="{{item.link}}">
                <img src="{{item.link}}?Action=thumbnail&Width=250&Height=150&algorithm=fill_proportional">
            </a>
        </div>
        {% endfor %}
    </div>
</div>

Answer 1

BC 提供了分页对象来完成这一任务。 该对象为您提供 6 个参数:currentPage、itemsPerPage、numberOfPages、totalItemsCount、previousPageUrl、nextPageUrl。 首先，您需要将 resultsPerPage=""添加到初始照片库模块标记，然后添加 {{test2016.pagination.previousPageUrl}} 作为 anchor 标记的 href 以获取上一页链接。

这取决于你想要什么，但你最终可能会得到这样的结果:

{module_photogallery id="12345" resultsPerPage="6" collection="test2016" template="" }
<div class="container">
    <div class="row">
        {% for item in test2016.items %}
        <div class="col-md-3 col-sm-3 col-xs-6">
            <a onclick="myLightbox.start(this);return false;" rel="lightbox[photo2015]" href="{{item.link}}">
                <img src="{{item.link}}?Action=thumbnail&Width=250&Height=150&algorithm=fill_proportional">
            </a>
        </div>
        {% endfor %}

        <a href="{{test2016.pagination.previousPageUrl}}">Prev</a> <a href="{{test2016.pagination.nextPageUrl}}">Next</a>

    </div>
</div>

使用一些 if...then 语句和一些其他参数来准确获得您想要的内容。