The way WordPress handles post pages is to provide links to the previous posts and next posts, using previous_posts_link() and next_posts_link() respectively. When redesigning my site, I wanted to paginate the post pages to provide users with a more usable, intuitive interface.
While there are a number of WordPress plugins that enable pagination, I chose to write my own. I wanted a something that was flexible enough to be used in a number of different situations, but most of all I wanted the experience and challenge of writing my own pagination function.
Overview
The code, while fairly compact, is a bit too much to display, so I’ve provided a download that contains the following:
paginate.txt– The pagination functions to place in your theme’sfunctions.phpfilepaginate.css– The CSS to put in your theme’sstyle.cssfilereadme.txt– The details about the pagination code
Demo
To see the pagination in action, check out the links at the bottom of the Photography or Blog pages on this site.
Usage
After you have downloaded the files and placed the code in your theme, you’ll need to replace the WordPress next/previous links with this new pagination function.
For example, in the default theme’s index.php file, you’d replace:
<div class="navigation">
<div class="alignleft"><?php next_posts_link('« Older Entries') ?></div>
<div class="alignright"><?php previous_posts_link('Newer Entries »') ?></div>
</div>
With:
<?php if (function_exists("emm_paginate")) {
emm_paginate();
} ?>
The emm_paginate() function takes one optional argument, in query string format, which allows you to customize the output. See below for details on the available options.
Options
page[Number:null]
The current page. This function will automatically determine the value.pages[Number:null]
The total number of pages. This function will automatically determine the value.range[Number:3]
The number of page links to show before and after the current page.gap[Number:3]
The minimum number of pages before a gap is replaced with ellipses (…).anchor[Number:1]
The number of links to always show at begining and end of pagination.before[String:'<div class=”emm-paginate”>’]
The html or text to add before the pagination links.after[String:'</div>’]
The html or text to add after the pagination links.title[String:’__(“Pages:”)’]
The text to display before the pagination links.next_page[String:’__(“»”)’]
The text to use for the next page link.previous_page[String:’__(“«”)’]
The text to use for the previous page link.echo[Number:1]
To return the code instead of echo’ing, set this to 0 (zero).
If you have any questions or find any issues, please let me know. Also, if you use the code, leave a comment with a link to your site so we can check it out!
Thank you so much!!
So simple, and effective – I initially started with WP-Navi by Lester Chan, but it was way too verbose for me.
I modified your excellent code a bit, to output an unordered list – let me know if you’d like to see it.
Thx again!
@Casper – thanks, I’m glad it is useful for you. I debated what to output, a list makes sense. I’d be happy to see your updates, just send them to eric at this domain.
For those who aren’t as comfortable implementing the code, I’ll be releasing this as a plugin soon…stay tuned.
Pingback: WP-Paginate Released / Eric Martin / ericmmartin.com
Awesome! I’ve been looking for something exactly like this and couldn’t find it anywhere else. Once my site’s up and running, I’ll definitely give you credit & a link.
Thanks Eric!
A big thank you, your function is the best for me and my needs, you should advertise it more because is number 1 in WordPress pagination. I like it very much and already use it on my site.
works really well (even on WPMU installs ;))
thanks a lot.
Hello, I’ve tried your function and it works perfectly on the index. However it is not working neither on the categories nor the tags. Should it work as well? It would be really useful if we could use the same pagination on the whole site.
Thank you.
Very easy to use and style. Thanks a lot. 🙂
to Xavier: I don’t know about tags but works nice with categories.
The plugin does not handle threaded comment pagination. The last comment link shows blank.
Super useful, thanks – but there’s a typo in the code under “Usage” above:
<php if (function_exists("emm_paginate"))...…is missing the question mark in the php opening tag.
@Xavier – it should work on tags too!
@Alex – thanks! I should have a fix soon.
@MH – Good catch, thanks!
Many thanks for this Eric. Works brilliantly!
You are a champion!
Thanks for creating such an awesome plugin!
I’ve used the function in a couple of projects. It makes life so much easier to customise the pagination system. Thank you!
Pingback: Eternalised » Blog Archive » Tutorial: How to optimize and style the comments.php file for WordPress
I really like what you have created here but I have one issue and that is I would like to use this function on my single page template to paginate between posts … the default links arent enough for my client and they would like to add numeric navigation between those links … I can easily achieve this on page templates, index.php, search.php, and archive, but not single.php … any light you could shed on my problem would be most appreciated. thank you in advance.
Excellent pagination script.
Ideal for incorporating into a theme rather than relying on a separate plugin.
Some other plugins are too bloated for me to be willing to incorporate them into a theme, but this is just fine as it’s nice and light.