Easier way to change page order (AJAX/jQuery?)

+1 for page ordering w/ arrows (w/ AJAX too!)

I've thought about writing a patch for this myself. Keep in mind though, if doing up/down for page ordering, the patch also has to take into account page hierarchy.

Drag/Drop might be difficult with heirarchy issues

Right now, the only thing that can be changed on Manage Pages is deleting pages, which done through the Delete button.

The only useful thing that can be added that I can think of is the page order. So when doing it with drag-and-drop, Manage Pages could have a Apply Page Order button. Submitting/processing that wouldn't be too hard, even with permissions in mind. (But the drag-and-drop scripts would require some work).

On the other hand, when doing it with Move up and Move down buttons, this is easier to code (both displaying it, and submitting/processing it, permissions included.

Drag and drop would make a nice JS project. It's not impossible even with the hierarchy, see Firefox's bookmark manager for an example for how the interface might look.

Any takers?

Seems like doing it through Move up and Move down buttons is not really an options, as it will need to reload the page with each click. And people don't like that apparently: See also ticket #2561.

I guess AJAX is the way to go (but that's not my area, so I'll just be the submitter here :P)

However, it might be hard if #2004 checks out, since, if an item is at the bottom of the page, it can't be moved down (same with if it's the first item on the page, it can't be moved up. Or you can't move any item off a page to another).

Changed to summary to reflect the AJAX question, so it may be able to attract the AJAX guru mdawaffe :).

For reference, check out the functional tests for Scriptaculous 1.6.1. He's implemented a Drag/Drop Sortable Tree function. I think it's still experimental though.

In regards to #2004, unless the Drag/Drop JS was REALLY kickass to scroll through the pages when you dragged the item over the "Next Page" and "Prev Page" links (AJAX ahoy!), this would nix paging on Pages page.

Also, I'm yet to see an implementation of Drag/Drop reordering that degrades and is accessible. If it's been done, link me, I'm really curious to see how. Or is admin accessibility just being thrown to the wayside these days?

Up/down arrows w/ AJAX list management would degrade nicely, but that presents a per-move page reload tradeoff, like you mentioned.

Or is this a matter of the JS-enabled get a cool new feature, and those without do it the old-fashioned way (Edit->Save, Edit->Save)?

Those without JS will always be stuck with edit, save, edit, save... That is all you can do with a non-JS browser. Drag-drop isn't possible with plain HTML. Take it up with Tim B-L if you don't like it ;-)

Scriptaculous is no stranger to WordPress. It is distributed in the Widgets plugin. It is not a good solution for this problem.

There is not presently any script known to us that can do all of the things on our wish list. The closest match is Brothercake's DBX, which is what we use for the Write pages. It is keyboard-accessible but it is not meant to work without Javascript.

To make a sortable list that degrades for non-JS users, we would have to put additional markup in the list (links to move each item up/down) and augment DBX to remove those vestigial links.

This would be relatively straightforward using DBX and nested dbx_groups.

Rewrite page_rows() such that the HTML reflects the page hierarchy. Pages without children wouild just be a draggable DBX element. Pages with children would be a draggable DBX element and would also contain a new dbx_group in which all its children were elements. You'd be able to to move each page (together with its children) within the list. Until DBX supports dragging items between different dbx_groups (apparently, this is in the works), you would not be able to change the hierarchy, just the ordering; you could only reorder children under their current parents. DBX is an accessibility dream; I don't believe there would be any problems there.

Then just have a regular old button at the bottom of the screen "Save Page Orders" that would submit a regular old form populated by JS with the value of the DBX cookie. No AJAX needed. In fact, doing AJAX on every drag and drop would be a mess.

You'd have to be carefull with the hierarchical HTML so that list-manipulation would play nice. You wouldn't want to delete a parent page and have all its children disappear from the screen as well. Stick with tables; it should be a flat table (no nested tables) with nested *tbody* elements that define the dbx_groups and draggable elements. (I'm not sure if that'd be valid HTML... anyone know?).

That was supposed to be "If you want to stick with tables...". Nested lists would work as well as long as you were careful. It'd be semantically better than the current implementation, but would be inconsistent with the Manage Posts table.

Another suggestion to make life easier:

In Edit Page maybe there could be the Move Up / Move Down buttons, in addition to the existing input box. Having those buttons is more user-friendly for anyone. Especially for clueless newbies.

Although the description is different, this issue has been mentioned in Google Summer of Code 2007 for the Wordpress Project as an idea: Hierarchical Page (list) Management using jQuery.

I will be working on this improvement as a Google Summer of Code project (just beginning). I will be happy to receive any comments or suggestions.

Here's the answer: http://geekyweekly.com/mypageorder

This plugin has a lot of merit, but there are a few issues (in my opinion) that make it not usable to be included in the wordpress core and differ from what I am going to implement:

* It adds another page in the admin are just for page ordering. The idea is to alter the page list itself to provide such functionality, and make it extendable (the javascript part) so that it can also be use in other parts of the wordpress admin. * The way it order subpages, even though it works, is somewhat "now ajaxian" and would be impossible to implement in the main page list. * It uses scriptaculous and prototype, and it is defined by the Wordpress team that jQuery is now the "oficial" javascript framework to be used in new implementations. Ok, if it was exactly what the wordpress team wanted I guess this wouldn't be a big problem, since what is done is done (like the widgets, that also use prototype), but it doesn't seem to be the case.

Anyway, this plugin does serve as an starting point and sheds a few ideas. I have overlooked its code, and seems pretty simple. Thanks a lot for the tip!

I'm the author of My Page Order (as well as My Link Order and My Category Order) and the intention of my plugins has always been to provide a quick and easy way of setting a manual display order for pages, post categories, link categories and links, something not easily done with WP out of the box.

One possible problem I see with adding the ability to order pages on the management panel is that none of the list pages are used to modify data except for marking records for deletion. Adding drag and drop ordering to this list would potentially open up all the list pages to more complexity (i.e. adding a category dropdown on each blogroll row ).

Also need to keep in mind that not everyone displays pages in their themes using the page order. For those that list by id, title, slug, creation date, modified date or author, will an option be provided to list the pages in their desired order like the dropdowns available on the Blogroll list?

If WP developers are ready to push functionality from the edit pages out onto the list pages then sure go for it. Through my experience developing and supporting my plugins (My Page Order being the least popular) I'm just not convinced there's that much demand for this out there. Only a subset of users use the page order in their themes and an even smaller number have enough pages that need to be reordered frequently where the built in functionality becomes cumbersome. Those people that demand more control over the order then have plugins like mine to turn to.

It's a good idea but I'm not sure if the increase in convenience outweighs the increase in complexity. Anyone else have thoughts on this, I'm new to the WP dev scene so some more experienced voices would be welcome.

Thanks for the great advice, froman118 (and also for the plugin!). I agree with a lot of the points you mentioned, specially the one about the user having the possibility to choose how to order the pages in the page list, similar to the Blogroll. I think it definitely needs to be done. To simplify the interface, if the user was not using the page order number to order the pages, the drag and drop control could disappear or be deactivated.

I agree that this is not a functionality that people would "die for", but I believe it adds a lot to the perceived quality of Wordpress as a product. The solution of changing the page order by number inside the editing panel felt like a dirty patch from the first time I used it.

People won't change the page order so frequently and will generally only mess with it when they are initially creating the pages, so downloading and installing a plugin just for this would apply only to users who have really special needs and manage a lot of pages frequently (the vast minority). Most users will figure out how it is done, get a little pissed of how laborious it is, do it and move on, not even thinking there would be a plugin to improve that. Perhaps this might even be one of the reasons why people don't use page ordering that much (although I see it on most of new themes). You also can't ignore the fact that the natural evolution of Wordpress is to become more and more a complete CMS, and pages are very important in this context.

The idea in this project is to try to create something that could be reused in other places of the admin, where ordering is needed or could be used. Just like the other plugins you designed for categories and links.

If complexity in the user perspective is what you are talking about, I agree it is really important to try to minimize it and I think it can be done in this case. You can't forget that in the page editing the "Page Order" field would go away, and things would be neater there (and more intuitive in general).

I agree that this is a detail, but I think attention to details does pay a big role in something's success (I believe Wordpress' success is in great way due to how well thought most of its details are). I like to mention the example of the new Apple's MacBook? power adapter: it has a minimal impact on what the user generally does with a notebook, but it is one of the first things people notice and say about their Macs. The "Woow" effect and attention to details definitely play a major role on how much people will love or hate to use a product.

I will be giving details on the project in this blog: http://bitsinashortbit.wordpress.com

I have finished my GSoC project. Please, check this post for more information and to be able to see the demos and download the patches.

This is the patch as of 19-september-2007. If you need it updated to the latest version of trunk just ask me and I will send it here.

Turned out pretty good, looking forward to seeing it included in Wordpress so I can finally retire my plugin.

+1 As a user who is using or helping others use WordPress as a CMS for three different websites, page order is extremely important to me when using it in this context! It is currently a very frustrating thing to change with the current solution. Even having a row of textboxes you could fill in order numbers in on the Manage Pages page would be nice, but drag and drop would be much better! I would love it if this patch were applied to core!

Additionally, moving from a "page order number" concept to at least a dropdown on the page edit form saying "this page is after: x" with a list of pages to select from would make this at least a little more simple than the way it currently is. Now, I have to edit the pages before and after a particular page just to see what their order numbers are before I edit the actual page I want to change. See the In Series plugin for what I'm talking about, the way it lets you pick where in a series a post goes.

I'll stop drooling over this patch now :-)

Are the devs interested in adding this to the core? It's been sitting here for a few months, and it's great code.

berpasan's documentation was updated 13NOV07: http://code.google.com/p/nestedsortables/wiki/NestedSortableWidgetDocumentation

And his blogpost about snags w/jQuery is dated 17OCT07: http://bitsinashortbit.wordpress.com/2007/10/17/new-minor-version-of-nestedsortable/

cpoteet's suggestion, "My Page Order" plugin, was updated 30SEP07 ("Checked compatibility with WP 2.3"): http://geekyweekly.com/mypageorder

GSoC2007 "Hierarchical Page (list) Management" apparently wasn't updated after the summer ... last changed MAY07.

Hierarchical Page (list) Management using jQuery by Bernardo de Pádua dos Santos, mentored by Michael D Adams (no date) at code.google is a good description of WTBD, but leads to no resolution.

*re-jigged for email*

berpasan's blogpost about snags w/jQuery v1.2, dated 17OCT07: http://bitsinashortbit.wordpress.com/ ... /new-minor-version-of-nestedsortable/

Bumping milestone for feature freeze.