Get fresh WordPress Content delivered in your inbox with warpspeed!

learn wordpress wplift wordpress rocket

For navigating older posts, by default WordPress uses next and previous links which are ok but only allow you to go back one page at a time. If you would like to know how to add numbered pagination to WordPress like we use here on WPLift you can do so using the paginate_links function.

How to Add Numbered Pagination to WordPress

This is really easy to do and will improve the look of your theme while making it more user friendly, so lets see how to use it.

Add this code to your theme’s functions.php file :

// Numbered Pagination
function wplift_pagination() {
	global $wp_query;
		$big = 999999999; // need an unlikely integer
			echo paginate_links( array(
			'base' => str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ),
			'format' => '?paged=%#%',
			'current' => max( 1, get_query_var('paged') ),
			'total' => $wp_query->max_num_pages
		) );
}

Then where you want the pagination to appear, for example on archives.php, index.php etc you place this code :

[php]
<?php wplift_pagination(); ?>
[/php]

Now you need to style the resulting code, here is what I use in my Blogly theme, you need to add this to style.css in your theme folder:

/* Pagination */
.page_nav .page-numbers{
        background:#BCBCBC;
	color:#fff;
	display:block;
	width:auto;
	float:left;
	margin: 4px 4px 4px 0;
	padding:15px 18px 14px 18px;
	text-decoration:none;
}

.page_nav .page-numbers:hover{
	background: #24221D;
	color:#fff;
	text-decoration: none;
}

.page_nav .current{
        background: #24221D;
	color:#fff;
        padding:15px 18px 14px 18px;
}

Published:

Last updated on:

Oliver Dale is the founder of Kooc Media, An Internet Company based in Manchester, UK. I founded WPLift and ThemeFurnace, find out more on my Personal Blog. Thanks!

4 thoughts on “Quick Tip: How to Add Numbered Pagination to WordPress

  1. Thank you. This is great tip. Now i can remove the pagenavi and add this.

    Is there a way to show “Page 1 of x” before the numbered list?

  2. This is so much better than the default previous and next links and as Nikita mentioned you don’t need to use a plugin like pagenavi to have a usable paging system.

  3. Nice post thanks this one has been bookmarked. It’s always better to code something like this I try and use use the least amount of plugins as possible.

  4. Thanks!
    I always try to gather this kind of snippets, it makes it much easier to make some theme customisations.
    Yoast breadcrumbs and now WP-lift numbered pagination snippets, it’s good seo and not so difficult to implement.

Comments are closed.

Join 40,000 WordPress Astronauts
AND GET OUR LATEST CONTENT IN YOUR INBOX WITH WARPSPEED

We will never spam you.
close-link
siteground coupon
Get 60% Off the No. 1 WordPress Hosting!