It’s time to think about version 3 of pagebar. In this series I try to explain what I am planning for this new major version and invite you to discuss my plans.

Part 1: Direct page access

I always wanted to add a fast and direct page selection. The easiest way would be to add a selection box containing all page numbers. This might work if you’re having about 10 pages but if your blog is really, really large, say about 300 pages, a select box with 300 numbers would be quite clumsy:

There has to be a better way. Here are mockups of my suggestions of a fast page selection UI.

Hierarchical dropdown menus

The idea is a hierarchical representation of the pages in steps of 10 pages. If you select such a range you will get another popup displaying the the actual pages you can select. This selection requires three clicks but is much more accessible than an almost endless list of numbers.
What happens if you click the “100 – 199” link? Will there be a list of 100 pages? No, of course not, this wouldn’t be much better than the simple approach mentioned before. Instead it will display an additional popup:

I tweeted that the algorithm might be somewhat tricky but I stripped the idea down to the necessary so that the code itself should not be the problem. There might be some less important problems like what happens if the pagebar is at the bottom of the browser window (not too unlikely) and the popups would open outside the window but I think this can be handled with a little jquery code.

With many pages it is quite expensive to create the list over and over again so it would be a good idea to cache the list in a transient which is deleted and recalculated upon adding or removal of posts.

Direct keyboard input
If you don’t like the dropdown menus pagebar v3 could contain a simple direct input of the page number using the keyboard. I’m thinking of two versions. The first is expanding the button and containing a textinput inside (a) the other is opening a small popup above or below the pagebar (b). I’m not sure which to take:

Other methods

Are there any other good methods of jumping directly to a page that is not available in the main pagebar? If there is, don’t hesitate and enlighten me in the comment section. Thanks.