Timber V2分页自定义显示页数问题求助
解决Timber 2自定义分页显示规则的方案
Timber 2默认分页会生成9个页码条目,要实现你需要的自定义显示效果,可以通过以下两种方式解决:
方案一:使用PHP过滤器修改分页页码数组
在主题的functions.php中添加以下代码,通过timber/pagination/pages过滤器替换默认的页码数组,生成符合你需求的结构:
add_filter('timber/pagination/pages', function($pages, $pagination) { $current = $pagination->current(); $total = $pagination->total(); $new_pages = []; // 处理第1页的显示逻辑 if ($current === 1) { // 添加1、2、3三个页码 for ($i = 1; $i <= 3; $i++) { if ($i > $total) break; $new_pages[] = [ 'title' => $i, 'link' => $pagination->get_page_link($i), 'class' => $i === $current ? 'active' : '' ]; } // 总页数大于3时,添加省略号和最后一页 if ($total > 3) { $new_pages[] = [ 'title' => '...', 'link' => false, 'class' => 'pagination__ellipsis' ]; $new_pages[] = [ 'title' => $total, 'link' => $pagination->get_page_link($total), 'class' => '' ]; } } else { // 处理非第1页的显示逻辑(比如当前页为7) // 添加第一页 $new_pages[] = [ 'title' => 1, 'link' => $pagination->get_page_link(1), 'class' => 1 === $current ? 'active' : '' ]; // 当前页大于4时,添加省略号 if ($current > 4) { $new_pages[] = [ 'title' => '...', 'link' => false, 'class' => 'pagination__ellipsis' ]; } // 添加当前页前后2页的范围 $start = max(2, $current - 2); $end = min($total - 1, $current + 2); for ($i = $start; $i <= $end; $i++) { $new_pages[] = [ 'title' => $i, 'link' => $pagination->get_page_link($i), 'class' => $i === $current ? 'active' : '' ]; } // 当前页小于总页数-3时,添加省略号 if ($current < $total - 3) { $new_pages[] = [ 'title' => '...', 'link' => false, 'class' => 'pagination__ellipsis' ]; } // 添加最后一页 if ($total > 1) { $new_pages[] = [ 'title' => $total, 'link' => $pagination->get_page_link($total), 'class' => $total === $current ? 'active' : '' ]; } } return $new_pages; }, 10, 2);
添加这段代码后,你原来的Twig分页模板不需要修改,直接使用posts.pagination.pages循环即可,过滤器会自动替换成自定义的页码数组。
方案二:在Twig模板中手动构建分页结构
如果你不想修改PHP代码,可以直接在Twig模板里写逻辑,生成符合需求的分页元素,替换原来的循环部分:
{% if posts.pagination.pages is not empty %} <nav class="pagination" role="navigation" aria-label="pagination"> <ol class="pagination__items"> {% if posts.pagination.prev %} <li class="pagination__previous pagination__link"> <a href="{{ posts.pagination.prev.link }}">« {{ __( 'Vorige', 'my-site' ) }}</a> </li> {% endif %} {% set current = posts.pagination.current %} {% set total = posts.pagination.total %} {# 第1页的显示逻辑 #} {% if current == 1 %} {% for i in 1..3 %} {% if i > total %} {% break %} {% endif %} <li class="pagination__link {{ i == current ? 'active' : '' }}"> {% if i != current %} <a href="{{ posts.pagination.get_page_link(i) }}"> <span class="visually-hidden">{{ __( 'Pagina', 'my-site' ) }}</span> {{ i }} </a> {% else %} <span> <span class="visually-hidden">{{ __( 'Pagina', 'my-site' ) }}</span> {{ i }} </span> {% endif %} </li> {% endfor %} {% if total > 3 %} <li class="pagination__link pagination__ellipsis"> <span>...</span> </li> <li class="pagination__link"> <a href="{{ posts.pagination.get_page_link(total) }}"> <span class="visually-hidden">{{ __( 'Pagina', 'my-site' ) }}</span> {{ total }} </a> </li> {% endif %} {% else %} {# 非第1页的显示逻辑 #} <li class="pagination__link"> <a href="{{ posts.pagination.get_page_link(1) }}"> <span class="visually-hidden">{{ __( 'Pagina', 'my-site' ) }}</span> 1 </a> </li> {% if current > 4 %} <li class="pagination__link pagination__ellipsis"> <span>...</span> </li> {% endif %} {% set start = max(2, current - 2) %} {% set end = min(total - 1, current + 2) %} {% for i in start..end %} <li class="pagination__link {{ i == current ? 'active' : '' }}"> {% if i != current %} <a href="{{ posts.pagination.get_page_link(i) }}"> <span class="visually-hidden">{{ __( 'Pagina', 'my-site' ) }}</span> {{ i }} </a> {% else %} <span> <span class="visually-hidden">{{ __( 'Pagina', 'my-site' ) }}</span> {{ i }} </span> {% endif %} </li> {% endfor %} {% if current < total - 3 %} <li class="pagination__link pagination__ellipsis"> <span>...</span> </li> {% endif %} <li class="pagination__link"> <a href="{{ posts.pagination.get_page_link(total) }}"> <span class="visually-hidden">{{ __( 'Pagina', 'my-site' ) }}</span> {{ total }} </a> </li> {% endif %} {% if posts.pagination.next %} <li class="pagination__next pagination__link"> <a href="{{ posts.pagination.next.link }}">{{ __('Volgende', 'my-site') }}»</a> </li> {% endif %} </ol> </nav> {% endif %}
两种方案都能实现你需要的分页显示效果:
- 第1页显示:
1 | 2 | 3 | ... | 300 | Next > - 第7页显示:
< Back | 1 | ... | 5 | 6 | 7 | 8 | 9 | ... | 300 | Next >
内容的提问来源于stack exchange,提问作者Mark Jansen
相关产品推荐
相关产品推荐

