这是默认模板：
<wicket:panel> <a wicket:id="first" class="first"><<</a> <a wicket:id="prev" class="prev"><</a> <span wicket:id="navigation" class="goto"> <a wicket:id="pageLink" href="#"><span wicket:id="pageNumber">5</span></a> </span> <a wicket:id="next" class="next">></a> <a wicket:id="last" class="last">>></a></wicket:panel>
当然最外围的tag由该组件的模板决定。比如外围用div：
<div wicket:id="mypaginator"></div>
现在假设需要purecss样式的pagingNavigator，它的html如下：
<ul class="pure-paginator"> <li><a class="pure-button prev" href="#">«</a></li> <li><a class="pure-button" href="#">1</a></li> <li><a class="pure-button pure-button-active" href="#">2</a></li> <li><a class="pure-button" href="#">3</a></li> <li><a class="pure-button" href="#">4</a></li> <li><a class="pure-button" href="#">5</a></li> <li><a class="pure-button next" href="#">»</a></li></ul>
可见两者的差别还是不少。让我们看看可能的方法：
1、新建一个类，继承PagingNavigator。
比如类名称是PagingNavigator，然后建立对应的模板文件PagingNavigator.html，内容如下：
<ul class="pure-paginator"> <li><a wicket:id="first" class="pure-button first" href="#">«</a></li> <li><a wicket:id="prev" class="pure-button prev" href="#">«</a></li> <li wicket:id="navigation"><a wicket:id="pageLink" class="pure-button" href="#"><wicket:container wicket:id="pageNumber"></wicket:container></a></li> <li><a wicket:id="next" class="pure-button next" href="#">»</a></li> <li><a wicket:id="last" class="pure-button last" href="#">»</a></li></ul>
这样子画出来的PagingNavigator的就是purecss样式的。但是还需要完善，当前页的样式，没有最后一页的时候按钮应该disabled。也就是说根据当前页的情况需要添加pure-button-disabled，或者pure-button-active样式。
为了达成这个功能，我们需要更深的探究PagingNavigator类，看看哪里可以实现这个功能。
对照上面的模板，其中wicket:id="navigation"对应的是PagingNavigation组件，其中有一个方法是：
@Override protected void populateItem(final LoopItem loopItem) { // Get the index of page this link shall point to final long pageIndex = getStartIndex() + loopItem.getIndex(); // Add a page link pointing to the page final AbstractLink link = newPagingNavigationLink("pageLink", pageable, pageIndex); link.add(new TitleAppender(pageIndex)); loopItem.add(link); // Add a page number label to the list which is enclosed by the link String label = ""; if (labelProvider != null) { label = labelProvider.getPageLabel(pageIndex); } else { label = String.valueOf(pageIndex + 1); } link.add(new Label("pageNumber", label)); }其中TitleAppender用来添加link的title属性，这样鼠标移到上面的时候就会提示，比如goto 2 page等等。接下来是label，就是pageNumber对应的组件。
可以通过复写这个方法，根据情况对label进行修饰（AttributeModifier），最终达到需要的效果。
