不用插件实现漂亮的页面导航功能
2012/05/03
页面导航功能是大多数博客或网站都需要的,一般都用wp-pagenavi插件来实现。这一般没什么问题,特别是一般的用户来说。但是如果你是一个特别不喜欢插件的人,实际上使用 paginate_links()这个wordpress自2.1版本以来就内置的导航函数就可以实现。但是你要说,这个就是显示早期文章,最新文章两个选项,特别难看。有没有办法实现数字导航呢?
办法是有的,把如下代码写到你的函数文件中:
// get total number of pages global $wp_query; $total = $wp_query->max_num_pages; // only bother with the rest if we have more than 1 page! if ( $total > 1 ) { // get the current page if ( !$current_page = get_query_var('paged') ) $current_page = 1; // structure of “format” depends on whether we’re using pretty permalinks $format = empty( get_option('permalink_structure') ) ? '&page=%#%' : 'page/%#%/'; echo paginate_links(array( 'base' => get_pagenum_link(1) . '%_%', 'format' => $format, 'current' => $current_page, 'total' => $total, 'mid_size' => 4, 'type' => 'list' )); }
HTML源码显示为:
<ul class='page-numbers'> <li><span class='page-numbers current'>1</span></li> <li><a class='page-numbers' href='http://mysite.com/page/2/'>2</a></li> <li><a class='page-numbers' href='http://mysite.com/page/3/'>3</a></li> <li><a class='page-numbers' href='http://mysite.com/page/4/'>4</a></li> <li><a class='page-numbers' href='http://mysite.com/page/5/'>5</a></li> <li><span class='page-numbers dots'>...</span></li> <li><a class='page-numbers' href='http://mysite.com/page/10/'>10</a></li> <li><a class='next page-numbers' href='http://mysite.com/page/2/'>Next »</a></li> </ul>
下面是使用 paginate_links()展示的效果。
提示:如果要完全实现上面的一样的演示效果,还需要CSS支持哦。