Preview the WordPress Menu Customizer: Alpha Plugin Ready for Testing

WordPress 3.9 made huge strides toward improving the theme customization experience by adding widgets to the customizer for live previews. But have you ever thought about the possibility of setting up your WordPress menus within the customizer?

Nick Halsey is tackling this as part of his Google Summer of Code 2014 Project and has just released an alpha plugin for testing the menu customizer. It will be under heavy development throughout the summer and certain features will require core patches. Using the plugin requires the latest trunk version of WordPress (4.0).

Halsey explains his larger vision for the project in the original proposal, which reaches beyond simply bringing menus into the customizer. The goal is to help mature the customizer into a tool that can realistically be used for live editing anything on the frontend, in cooperation with the planned frontend content editor:

Once the Customizer is feature-complete, we can begin to experiment with alternative approaches to accessing the customizer, making it feel more like an editing mode on the front-end of the site, alongside the front-end content-editor

He is developing the plugin with backwards compatibility and with the hopes of it being something that can be added to core later this year, although there are no guarantees. In the revised project scope, Halsey suggests that the menu customizer could potentially replace the existing menus screen for supported users. At the beginning of August he plans to prepare a core patch for the plugin merge and draft a proposal for its inclusion in core.

A Preview of the Menu Customizer Plugin

The Menu Customizer provides a convenient way to assign locations for menus within the theme’s available options:

theme-locations

It also allows for editing, reordering, deleting, and adding individual menu items within any menu:

customize-menu

Currently, the process of adding links seems rather complex and a bit chaotic, even for a seasoned WordPress user. Longer menus and those that are deep-nested have the potential to become quite unwieldly to manage within the narrow customizer controls area.

add-links

Halsey is well-aware of these challenges and in the coming weeks he will be addressing the need to implement screen options into the new menus interface. His GSoC project includes time for working through outstanding issues with implementation and responding to UI/UX feedback from the core team and community.

The ability to customize menus and set their locations within the theme customizer is convenient, especially for those who are new to WordPress. Finding just a few options in the customizer while also having to hunt around the dashboard to make other frontend changes can be confusing. One of the more difficult challenges here will be for UI/UX contributors to ensure that menu management in the customizer is just as easy as it would be in the dashboard.

To follow along with the progress, check out the revised scope and its related core patches. If you’re feeling adventurous and want to try out the plugin, make sure to install the Menu Customizer on a test site only, as it’s still very alpha and not yet ready for use in production.

6 Comments


  1. Thanks for the detailed write-up, Sarah!

    One important clarification on just how alpha it is – currently the only things that get saved are menu names and the automatically add new items setting – and those both require a pending core patch, unfortunately. The screen options are in place and should work, though, it’s in the four-square icon and they sync with the existing Menus screen. Much of the initial UI is in place and you can get a good sense of how everything might look once the underlying functionality is completed. I just updated the plugin description to reflect this as well.

    One of the most important pieces to enabling the Menu Customizer to feel more manageable, and to improving the Widget Customizer experience at the same time, is a core Customizer “Pages” feature that groups several control sections together. We’re working on that here: https://core.trac.wordpress.org/ticket/27406. Currently, we have core patches with a couple of different approaches and are awaiting feedback from lead devs on the API side and designers on the UI/UX side. I made a quick demo video too: https://cloudup.com/cpFF42uiW2l

    While the ability to set theme locations has been in the customizer from the start, complete menu management in the customizer could be a gateway to exploring broader applications for the customizer’s use, since menus are not as theme-centric as the current interface presents them. One idea I had recently was to merge all of WordPress core’s settings pages into the customizer, utilizing the customizer pages concept mentioned above.

    There’s a lot of other customizer-related work going on in Core Trac right now (largely by Weston Ruter, who created the Widget Customizer), which should come together to really expand the possibilities here.

    I’m really excited to have the opportunity to work on this project. Things are getting improved on a daily basis and hopefully it’ll get to the point that it’s feature-complete and ready for full-scale testing and feedback soon!

    Report


  2. Wow this is awesome. Menu is one of the hardest part to style, especially for beginners. This is a game changer. Going to try the plugin.

    Cheers,
    Jay

    Report


  3. Interesting idea. Everything for customization is going into Customizer!

    Report


  4. This would be awesome if it works, but I’m concerned about how awkward the UI would be for this. I’d thought about building something similar in the past, but could never come up with a UI setup which I thought would lead to an experience worth using over the admin panel menu UI. Hopefully they can come up with something better than I could :)

    Report

Comments are closed.