Wp-calypso: Menus: deprecate Calypso menus and send to Customizer menus instead

[lancewillett]

Calypso menus today:

Calypso menus tomorrow?

Reasons to believe:

1. DRY.
2. Current menu UX isn't amazing and has a few bugs.
3. Front-end visualization and editing is a great win for authors.
4. Comes from WordPress.com core. Better, more consistent UX for all WordPresses (25%+ of the web).

[MichaelArestad]

Mega +1 from me. I think the current state of menus is fairly rough and the customizer version feels much nicer. Until we iterated on the current menu view, I'm all about it. How do the customizer menus UI handle on mobile?

[shaunandrews]

Exactly what @MichaelArestad said — I'm totally down for this.

[melchoyce]

Love this idea.

Only catch: as Gravity works on making a native Calypso Customizer, we'll eventually want to base the Customizer menu on the existing Calypso menu component (with an iteration). This isn't on our roadmap until after September, though.

How do the customizer menus UI handle on mobile?

Incredibly poorly. 4.6, anyone?

[hugobaeta]

Please, yes! (also, what @MichaelArestad said) :+1:

@melchoyce why not the opposite, and help improve the menu in customizer in core?

[graciemae]

YES. The Customizer menu is so much more simple for users, requiring fewer steps to add and move items, which also makes it simpler to explain to users.

[catkit]

Yay!

@melchoyce why not the opposite, and help improve the menu in customizer in core?

Yes, please! :)

[SiobhyB]

This would be amazing and so much simpler for users!

The main thing I would miss from the Calypso menu is how easy it is to edit each individual menu item. Users sometimes need to change a menu item's link, and it's easy to do this in Calypso via the pencil icon:

From the Customizer, I would currently need to guide a user to completely remove and then re-add a new menu item in order to change a link.

It's good to hear that Gravity are working on a native Calypso Customizer and my fingers are crossed that the option to edit makes its way in. :)

[apeatling]

Let's make this change, we need to figure out who can do it though.

[lancewillett]

We'll want to make sure any existing /menus links go to the Customizer, with the menus area open.

[melchoyce]

Would it make sense to do this in conjunction with launching 4.7.x on WordPress.com? It'll pair nicely with the ability to create new pages for menus from within the Customizer.

[davewhitley]

There have been issues with the Customizer not being very visible as a secondary button on the Themes sidebar item.

Maybe this is a good chance to separate it as it's own sidebar item?

We should talk to Happiness to see if this would make sense, then test in Horizon.

[MichaelArestad]

Maybe this is a good chance to separate it as it's own sidebar item?

Not a bad idea. I think we may be removing the Sharing sidebar item soonish which would free up some space. :)

[melchoyce]

There's also been some recent discussion about re-running the A/B test to swap the two buttons. (cc @karmatosed)

[karmatosed]

It could be really cool to bring the menu swap for Theme/Customizer in and also do menus. We hadn't been adding as separate to keep with existing pattern, however I really like @drw158 your suggestion of having each as menu item.

[apeatling]

Nice idea to swap them. One oddity of this is the sidebar section. "Personalize", with first item "Customize" seems in a way redundant.

[alisterscott]

I think this could be done in two smaller PRs:

1. Keep the same menu experience and redirect the menus route to the customizer (no UX/design needed)
2. Improve the "Personalize" menu section to better reflect what can be done with themes/customizer (UX/design needed)

I'm happy to look at developing a PR for 1, but I can't work out how to deep link to sections in the customizer. It seems this works:

https://wordpress.com/customize/mytestsite.wordpress.com?autofocus%5Bsection%5D=title_tagline

but this doesn't work:

https://wordpress.com/customize/mytestsite.wordpress.com?autofocus%5Bsection%5D=nav_menus

Is there a change needed to the customizer code to allow deep linking into the menus section (like title_tagline above or identity below?)?

I also tried this but it didn't work:

https://wordpress.com/customize/menus/mytestsite.wordpress.com

but this also works:

https://wordpress.com/customize/identity/mytestsite.wordpress.com

[davewhitley]

To try to synthesize all the ideas here for No. 2 in @alisterscott 's comment above:

Just swap Themes and Customize

Separate Customize into its own item

Rename "Personalize" to "Design"

This is just a quick idea, open to others.

---

Looking at these mockup, I could see a problem with users not being able to find Menus. They might go to Pages expecting that to change their menu appearance. I might think Customize is just for colors and stuff. We should test!

[melchoyce]

Looking at these mockup, I could see a problem with users not being able to find Menus. They might go to Pages expecting that to change their menu appearance. I might think Customize is just for colors and stuff. We should test!

👍

[folletto]

Just swap Themes and Customize

Note: as there's currently a flow Themes → Customizer but not a flow Customizer → Themes, I'd avoid doing a pure swap until that flow is added (i.e. re-introducing the "Change theme" button in Customizer but redirecting it to our Themes).

Other than the above, and even more once the above is fixed, both solutions are good.

[michaeldcain]

@alisterscott:

but this doesn't work: https://wordpress.com/customize/mytestsite.wordpress.com?autofocus%5Bsection%5D=nav_menus

The Nav Menus part of the Customizer is a "panel", not a "section". The following should work:

https://wordpress.com/customize/mytestsite.wordpress.com?autofocus[panel]=nav_menus

[kwight]

Point 1 of @alisterscott 's comment was merged yesterday in #12967 . Closing as this fixes the original issue, and continuing UX improvements in #13016.