Theme Activation Workflow with Customizer

[chipbennett]

When activating a Theme, the user should be redirected to the Theme Customizer.

Facilitate users to configure Theme settings immediately upon Theme activation. Currently, the user is presented with the Themes UI upon activation. The most-obvious user action at this point is "Customize". (To reach the Theme settings page through the Themes UI now, the user must click "Theme Details", and then click the appropriate link/button.)

Short-circuiting this workflow would provide several advantages:

1) Immediate Theme configuration, with fewer steps
2) Further encouragement/facilitation for Theme developers to hook into the Customizer API
3) No need to know where to find the "Theme Options" link/button from the Themes UI
4) No need to know either the standard Theme settings page location (Appearance -> Subpage), or a non-standard menu page added by the Theme

An alternate proposal: Merge the "Activate" and "Live Preview" buttons for non-active Themes.

Currently, for non-active Themes, two buttons are presented, "Activate" and "Live Preview". Users may not know that "Live Preview" is actually ("Configure, Live Preview, and Activate"). With this change, the two buttons could be condensed to a single button, which leads to the Theme customizer - allowing for Theme settings configuration and live-preview before activation.

[Frumph]

-1 to this, having the user immediately redirected away from the theme selection page will cause confusion. Most people are at the page and want to view their site with the theme and then move on to the next one if they don't like the initial representation; they don't want to have to go back and find where they can click to activate or find a different theme.

On updates with theme activation that isn't a problem since the user already knows what they are getting into and having information redirects on the updates of the theme and important information is sometimes, often times necessary.

However, going straight to the customizer. Not a good thing.

[downstairsdev]

Hi Chip. As someone who often switches between themes when doing development work, an automatic redirect to the customizer would not be so welcome. For themes that don't offer any customizer options (beyond the defaults) I'm also not sure how much value that would offer the user.

When someone activates a new theme, this notice is displayed:
"New theme activated. Visit site"

As an alternative to your suggestion, perhaps the notice could just be updated to:
"New theme activated. Visit site. Customize site."

[westonruter]

I don't think the two buttons should be condensed into one, but I do think that the "Live Preview" button should let the user know that it's not just about previewing: it's also a path through which the new theme can be configured and activated. Perhaps a tooltip is in order on the Live Preview button which explains this.

I also like the suggestion of updating the notice to include a link to the Customizer:

New theme activated. Visit site. Customize site.

[F4rkie]

Why not add the ability to just Save an unactivated theme? This way the buttons stay and don't need modifying.

[folletto]

I can give here some perspective since we have already "solved" this issue on WordPress.com. In one of the tests we conducted we noticed the issue: people activating a theme were left to themselves with no clear next step.

So we decided to test and in the end implement for everyone a small overlay that clearly states the potential next steps, and with one single next step clearly highlighted: "Customize your site".

While I think this could be even further improved, I can confirm that the solution works. ;)

Attached screenshot, but you can test it yourself of course since it's currently live. :)

[folletto]

wpcom theme activation overlay

[celloexpressions]

Make "Live Preview" primary and "Activate" secondary.

[celloexpressions]

Trac-ing ​https://irclogs.wordpress.org/chanlog.php?channel=wordpress-dev&day=2014-10-14&sort=asc#m940085. From @johnbillion:

We should make the 'Live Preview' button the default when browsing themes, instead of 'Activate'. The customiser is killer now.
Or scrap the Activate button entirely and make people go through the customiser

Let's turn this ticket's proposal around: it really doesn't make sense to activate a theme without live-previewing/customizing it first for most users. Therefore, we should guide the user in the best/most common path to activating a theme:

1. Select potential theme from themes.php
2. Live Preview/Customize, including setting up widgets & menus and editing theme options
3. Activate theme, which you've already customized and already know exactly how it looks/works on your site

All we need to do to achieve this, without running into complaints about removing the activate button for power users, is to make "Live Preview" the primary action and "Activate" secondary. We could also switch the order, although I definitely prefer the primary button on the right. The primary button implies the best option to try, and it makes sense to preview a theme before activating it live on the site. Once users click "Live Preview", the preview, configure & activate workflow is clear, so I think nudging users into this flow is enough.

[folletto]

I think your approach is sound, even more since the functional impact is zero, you're just nudging a different default.
Let's try it out and see how it feels. :)

[obenland]

I like it too. Should the button order be switched, so that the primary button stays first?

[celloexpressions]

I actually prefer primary on the right visually, as that matches some other primary button placements, like the publish button and the Customizer save button.

[SergeyBiryukov]

In 29957:

Themes: Make "Live Preview" the primary action and "Activate" secondary.

props celloexpressions.
fixes #26899.

[nacin]

Should the same thing happen on theme-install.php with "Install" and "Preview"?

[SergeyBiryukov]

Replying to nacin:

Should the same thing happen on theme-install.php with "Install" and "Preview"?

Yes, makes sense.

[nacin]

I was only leaving a note for future consideration, not a change in 4.1. Would someone like to make a ticket? I think it would deserve a user test and some other feedback, and I'm not convinced it should actually change, either. (Previews for uninstalled themes aren't very great showcases, for one.)

[SergeyBiryukov]

Follow-up: #30729