WordPress Pagination Without a Plugin (WP-PageNavi alternative)

Almost every blogger, who maintains a blog on WordPress, familiar with the WP-PageNavi plugin, which displays the pagination like on the image above.

But not everyone knows (including me until recently), what WordPress has a built-in function (starting from version 2.1) which implements virtually the same functional. And compared with the WP-PageNavi plugin this function very small in size.

Here’s what this function looks like:

function wp_corenavi() {
	global $wp_query, $wp_rewrite;
	$pages = '';
	$max = $wp_query->max_num_pages;
	if (!$current = get_query_var('paged')) $current = 1;
	$a['base'] = str_replace(999999999, '%#%', get_pagenum_link(999999999));
	$a['total'] = $max;
	$a['current'] = $current;

	$total = 1; //1 - display the text "Page N of N", 0 - not display
	$a['mid_size'] = 5; //how many links to show on the left and right of the current
	$a['end_size'] = 1; //how many links to show in the beginning and end
	$a['prev_text'] = '« Previous'; //text of the "Previous page" link
	$a['next_text'] = 'Next »'; //text of the "Next page" link

	if ($max > 1) echo '<div class="navigation">';
	if ($total == 1 && $max > 1) $pages = '<span class="pages">Page ' . $current . ' of ' . $max . '</span>'."\r\n";
	echo $pages . paginate_links($a);
	if ($max > 1) echo '</div>';
}

This code must be placed in the functions.php file of your template. The function have just five options, they are separated by line breaks.

To show the navigation, paste the following code in your template:

<?php if (function_exists('wp_corenavi')) wp_corenavi(); ?>

As a result the HTML code will looks like this:

<div class="navigation">
	<span class="pages">Page 7 of 27</span>
	<a class='prev page-numbers' href='http://site.name/page/6/'>&laquo; Previous</a>
	<a class='page-numbers' href='http://site.name/page/1/'>1</a>
	<span class='page-numbers dots'>...</span>
	<a class='page-numbers' href='http://site.name/page/4/'>4</a>
	<a class='page-numbers' href='http://site.name/page/5/'>5</a>
	<a class='page-numbers' href='http://site.name/page/6/'>6</a>
	<span class='page-numbers current'>7</span>
	<a class='page-numbers' href='http://site.name/page/8/'>8</a>
	<a class='page-numbers' href='http://site.name/page/9/'>9</a>
	<a class='page-numbers' href='http://site.name/page/10/'>10</a>
	<span class='page-numbers dots'>...</span>
	<a class='page-numbers' href='http://site.name/page/27/'>27</a>
	<a class='next page-numbers' href='http://site.name/page/8/'>Next &raquo;</a>
</div>

As you can see it contains all the necessary classes to stylize navigation with CSS (the current page, dots, links to previous and next page).

I’ve tested this function on WordPress 2.3.3 and 3.1 and also tested variants with active and inactive permalinks. Everything works as expected. I think it will work also in a new versions of WordPress.