Widgets make WordPress stand out as one of the most user-friendly CMS options available. The ability to easily place content blocks and features into a widgetized area has made website customization possible for millions of people who don’t know how to code. As mobile browsing has increased over the past few years, widget design is now moving to accommodate use on mobile devices. Due to the popularity of widgets in general, new designs must also accommodate users who have dozens of available widgets.
Better Widgets
Shaun Andrews’ Widgets Area Chooser plugin is on its way into the core for WordPress 3.8, but he’s not done improving widgets. Andrews is on a quest to make WordPress widgets better. To that end he has a couple of plugins that are currently in development. Better Widgets is one that he created in order to add more incremental updates.
Right now, if you check out the plugin’s page, all you will see is a vague description: “This makes widgets better. Trust me. Or don’t.” Since this is a plugin for continuing improvements to widgets, you’ll just have to install it and check it out.
Better Widgets offers a new layout, which briefly made an appearance in MP6 and includes separate scrollable areas for available widgets. It also provides better feedback when saving widgets.
Andrews may add a search filter to the plugin somewhere down the road, which would help users to quickly filter when searching a large number of widgets. He is also looking at adding the ability to drag widgets over closed sides, which would then automatically open so you could drop them in, similar to how dragging files around works in OS X. This is one plugin to watch for future updates if you want to be on the cutting edge of WordPress widget development.
Widgets in the WordPress Customizer
The widgets team is also working on an experimental plugin that allows users to edit and preview widgets in the WordPress Theme Customizer. The Widget Customizer plugin is being developed as part of the ongoing Widgets UI Refresh effort and the team hopes to have it ready to present for consideration in WordPress 3.9.
Widget Customizer gives you real-time previews of the edits you make to a widget before making them live. With this plugin turned on, no changes are live until the Save & Publish button is clicked. All widget-related actions are previewable before publishing, including:
- Adding a new widget
- Editing existing widgets
- Reordering widgets
- Dragging widgets to other sidebars
- Removing widgets from the sidebars
If you want to test it out, install Widget Customizer on a test site. The plugin’s description advocates the new feature by stating, “No longer do you have to edit your widgets blind!” Editing a widget and then having to navigate to the front-end to see what you did is in essence blind editing. Once you try the Widget Customizer, you may never go back to the old way of editing widgets.
The Better Widgets and Widget Customizer plugins are paving the way for the future of WordPress widgets. If you’ve ever been frustrated with widget management, you can breathe a sigh of relief, because some very nice updates are underway. Would you like to see real-time previews added to the core? What do you wish you could change about widget management?
It has been extremely rewarding to work on contributing the Widget Customizer to WordPress Core and to collaborate with the widgets team to mature the plugin for merging. I’m still shocked at how quickly the Widget Customizer materialized: the core pieces came together in just a couple days of late night hackathons. It started out as a feature for one of our partner’s sites at X-Team, but turned into something which really belongs in Core.
For the past few months, I’ve been enamored with the Customizer and have wanted to move as much site management as possible into it. I’ve been convinced that if something cannot be previewed, it is not suitable for high-profile (enterprise) sites. I really have enjoyed building on Paul Clark’s Styles plugin, and adding new Customizer controls to do things like managing galleries by opening the Media Manager lightbox while in the Customizer.
In addition to the Customizer, I’ve been increasingly focusing on using widgets as building blocks for as much as possible. Widgets are great little units of MVC, encapsulating the model, presentation, and logic for modules of site functionality. But I wanted to be able to edit widgets in the Customizer.
I realized that since widget instances are just stored in WordPress options, you can register a Customizer setting for each widget instance, and the widget form control can be rendered inside of a Customizer control. After a bit of wiring, submitting the widget control then updates the Customizer setting which then causes the preview window to show the changes, all without saving anything to the database, until you hit Save & Publish.
For Widget Customizer, the key pieces were already there in Core: they just had to be connected together.
Development of the plugin is done on GitHub. See the issues reported there for what is being worked on. Pull requests are welcome!