Add IDs to div.widgets-holder-wrap in widget admin screen to allow custom layout

[sillybean]

I've been fiddling around with the layout of wp-admin/widgets.php, using a stylesheet full of overrides enqueued to that page in my theme functions file, to see if I can produce a layout that better matches the theme and makes more sense to my users. (None of them understand the stacked-sidebar model.)

I've discovered that I can get pretty far, until it comes to creating two columns of sidebars. I can move the divs with the IDs matching those I registered, but the div.sidebar-name doesn't come with it. Since their wrapper, div.widgets-holder-wrap, doesn't have an ID, I can't easily rearrange the screen while the two parts as a group.

TL;DR: If you could add IDs to the wrappers within div#widgets-right, it'd be possible for adventurous theme developers to rearrange the sidebars.

See attached patch, and sample functions.php and admin-widget-overrides.css.

​Screenshot without the IDs
​Screenshot with the IDs

[sillybean]

Tiny patch to add IDs to widget wrappers

[sillybean]

CSS file that overrides the layout of the widget admin screen

[sillybean]

Sample theme functions.php including widget definitions and stylesheets

[smub]

This looks really neat Stephanie.

[ramiy]

i agree with you, the old stacked-sidebar model should be upgraded.

i hope to see this in 3.3.

[mikeschinkel]

This is really nice Stephanie, props.

As an aside, I'd would love to see a progressive search feature for the Available Widgets list like how search works in CPanel or on the Mac.

[ptahdunbar]

+1 on this and search for available/inactive widgets.

[sillybean]

Might this be folded in to the work being done on #17979?

[azaozz]

Replying to sillybean:

Yes, seems this was handled in #17979.