paginator 分页器


分页标签可用于快速创建“Google”风格的分页器,如下所示 -

Paginator 标签可以在页面评论搜索标签中使用。例子 - pagescomments and search tags. Example -

<cms:paginator />

Please see Core Concepts - Pagination for a detailed usage example.

参数

  • simple
  • position
  • adjacents
  • prev_text
  • next_text

simple

如果您希望此标记显示简单的“下一个”和“上一个”分页器,而不是 Google 风格的分页器,请将此参数设置为“1”。

position

默认情况下,此标签在最后一条记录之后的底部显示分页器。要使分页器显示在顶部,请将此参数设置为“1”。默认值为“0”。

adjacents

始终显示的按钮数量可以通过此参数更改。

prev_text

prev_text”按钮中使用的文本可以通过此参数设置。默认为“« prev”(« prev)

next_text

"next_text"按钮中使用的文本可以通过此参数设置。默认为“下一个”(下一个»)

变量

默认情况下该标签是自关闭的,并且不设置自己的任何变量,你可以查看输出的html,自行定义css样式。

但是我们如何精确定义自己的html分页呢?

这个标签可以以标签对的形式出现

<cms:paginator adjacents='1'>
    ...
</cms:paginator>

使用标签对的时候,cms提供以下变量用于定义自己的分页器。

k_crumb_type     // one of these 4: 'next', 'prev', 'ellipsis' or 'page'
k_crumb_disabled // pertinent for only 'next' and 'prev'
k_crumb_current  // pertinent for only 'page'
k_crumb_link
k_crumb_text

以下提供一个实例,用于完全自定义自己的分页:

<cms:pages masterpage=k_template_name paginate='1' limit='1' orderby='weight' order='asc'>
    <div class="pagination uk-flex uk-flex-middle">
        <cms:paginator adjacents='1'>
            <cms:if k_crumb_type='prev' >
                <div class="prev_page page_arrow">
                    <a <cms:if k_crumb_disabled>href="#" onClick="return false"<cms:else />href="<cms:show k_crumb_link />"</cms:if>><span><i uk-icon="chevron-left"></i></span> <em>上一页</em></a>
                </div>
            </cms:if>

            <ul>
            <cms:if k_crumb_type='ellipsis' >
                <li><a href="#" onClick="return false">&hellip;</a></li>
            </cms:if>

            <cms:if k_crumb_type='page' >
                <cms:if k_crumb_current>
                    <li class="active"><a href="#" onClick="return false" title="<cms:show k_crumb_text />"><cms:show k_crumb_text /></a></li>
                <cms:else />
                    <li><a href="<cms:show k_crumb_link />" title="<cms:show k_crumb_text />"><cms:show k_crumb_text /></a></li>
                </cms:if>
            </cms:if>
            </ul>

            <cms:if k_crumb_type='next' >
                <div class="next_page page_arrow">
                    <a <cms:if k_crumb_disabled>href="#" onClick="return false"<cms:else />href="<cms:show k_crumb_link />"</cms:if>><em>下一页</em> <span><i uk-icon="chevron-right"></i></span></a>
                </div>
            </cms:if>
        </cms:paginator>
    </div>
</cms:pages>