Untangling Themes

[annezazu]

Important

Project thread: pdL8AQ-10Z-p2

As part of the Untangling Calypso epic, this seeks to define requirements and any blockers for replacing wordpress.com/themes/ view with the standard WordPress wp-admin/themes.php view for new users.

This will reduce confusion navigating between Calypso and proper WordPress admin, creating a more coherent and expected experience.

Current known differences

My Themes tab

My Themes tab is only available in Calypso:

Upgrade nudges
Upgrade nudges both for individual paid themes and "Let us build your dream website" (DIFM).

Sorting/filtering

Sorting/filtering is completely different with Calypso focusing on verticals whereas Core focuses on Popular, Latest, Block themes, Favorites, Feature filtering. Alongside this, Calypso offers the ability to sort by All, Free, Partner, Included with Personal, Included with Premium, WooCommerce.

Calypso:

Core view:

Style variations visible

The Theme grid show style variations in Calypso whereas Core doesn't display them.

Custom Theme preview with upgrade nudges & support

When selecting a theme in Calypso, you land in a completely distinct preview to view the theme, including an option to contact support or view forums as well as any upgrade notice:

WP.com wp-admin navigation
We have a different navigation structure than Core with the Theme showcase link.

Theme showcase promotion
We have a theme showcase promotion on the Simple WP-admin Themes page.

"Add new Themes" button
WP.com's wp-admin is missing the "Add new themes" button:

Please edit to add more! This is just a start.

[Copons]

This should be doable, but it's a large project — larger than the scope of #95478.

Technical aspects aside, we should first resolve the conflict between this, any Core plans for the Themes section, and #95492.

Redesigning the Design Picker is non-controversial, as it's part of Onboarding and can be as custom as we want.

However, if we want to re-align Design Picker and Theme Showcase, then we must ask, "What about the wp-admin Themes section?"

[tanjoymor]

The theme view has an important impact on user experience and it would be good to gather a reasonable amount of feedback before major changes are implemented.

Currently, Simple and Atomic sites using the Classic (wp-admin) UI solve this by including both the Core theme view and the Dotcom Theme Showcase as a separate link under Appearance. The Dotcom Theme Showcase is an important component.

Idea: Might it be possible to include a button on the wp-admin theme view that loads the Dotcom theme Showcase?

There are also a number of inconsistencies currently that need auditing and exploring, such as the option to Add/Install/Upload a new theme.

Let me know what would be most useful from me when this component is being addressed.

[fditrapani]

@annezazu I added some items to your list.

It bothers me right now that we have discrepancies not only with Core but between Classic (Wp-admin) and Default (Calypso) as well. I'd love if we could bring this all as close to core as possible. I recognize that there will be some differences with how we handle plans and theme details but I think they can be more integrated into the Core way vs. our way. Once we align, then we can focus our efforts on making core better for everyone! I'll share some notes below based on the discrepencies.

My Themes tab is only available in Calypso
WP.com wp-admin navigation
"Add new Themes" button
Theme showcase promotion

I don't know for sure but I'd say these are all related in trying to make the theme showcase more visible. In Calypso, we do it by merging My themes into the showcase. In our version of WP-admin, we have an extra navigation item plus we also have a big promotional banner on simple sites. I wonder if we should go full core here and rely on people pressing the Add theme button to get to the marketplace:

If your intent is to browse themes, it's pretty hard to miss.

Sorting/filtering

As you pointed out, we have custom filters. What if we apply our filters that we're developing for the design picker in here:

Upgrade nudges

There's no getting away from these. Perhaps they can feel more core with the WordPress design system components.

Style variations visible

We've been discussing removing these. If we remove them, we don't have to worry about them.

Custom Theme preview with upgrade nudges & support

I agree with @tanjoymor that this is a tricky area to work on. What if we present our content within a modal to align it with the core approach?

[dsas]

My Themes tab is only available in Calypso
WP.com wp-admin navigation
"Add new Themes" button
Theme showcase promotion

I don't know for sure but I'd say these are all related in trying to make the theme showcase more visible. In Calypso, we do it by merging My themes into the showcase. In our version of WP-admin, we have an extra navigation item plus we also have a big promotional banner on simple sites. I wonder if we should go full core here and rely on people pressing the Add theme button to get to the marketplace

IIRC My Themes was partly to paper over the fact that we provide a site as part of a multisite install (which is very different to a Core single site install) and partly for parity because calypso on atomic had "My Themes".

Calypso on Atomic My Themes is the list of themes installed on the site.
Calypso on Simple My Themes is the list of themes that have been previously activated on the site.

I wonder if we should go full core here and rely on people pressing the Add theme button to get to the marketplace

The difference between "full core" on a single site, and "full core" on a multisite, is that the screen before this - the Core installed theme grid will by default show all of the themes installed on the multisite. I guess we'd have to move the "My Themes" logic to this screen instead 🤔

[fditrapani]

Calypso on Atomic My Themes is the list of themes installed on the site.
Calypso on Simple My Themes is the list of themes that have been previously activated on the site.

I guess we'd have to move the "My Themes" logic to this screen instead 🤔

Yeah, I could see that working. The themes page would show a list of themes, that had either been installed (Atomic) or activated (Simple), along with the Add new theme button.

[scruffian]

One issue is that, at present, the wp-admin view only shows themes you have previously used. We need to find a way for users to discover other themes that are available to them.

[fditrapani]

One issue is that, at present, the wp-admin view only shows themes you have previously used. We need to find a way for users to discover other themes that are available to them.

I agree this could be better but there is an Add theme button for now.

My thinking is once we have this aligned with core then we can focus on improving the core experience, when we're back at it again, and making it better on WP.com as well.

[richtabor]

I agree this could be better but there is an Add theme button for now.

Only on single WordPress installs, not multi-site (Simple sites).

We will need to add an Add New Theme button, emulating core. Perhaps the top blue one would be enough.

[fditrapani]

Only on single WordPress installs, not multi-site (Simple sites). We will need to add an Add New Theme button, emulating core. Perhaps the top blue one would be enough.

Right. My vote is to consolidate all our experiences as close to core as possible. Once we're there, then I think we can start cleaning things up both for us and for core. I know we have some differences around upgrades but I can see a way to integrate those into the core experience rather than diverge from it as we currently have.

[ryelle]

FYI regarding the "Add New Theme" button, I saw #96393 and made a Jetpack PR to add the button to simple sites. This is super simple and just adds a link to the Theme Showcase, as simple sites don't have the core theme-install view (yet).

One issue is that, at present, the wp-admin view only shows themes you have previously used. We need to find a way for users to discover other themes that are available to them.

Technically in core, this screen shows the themes you've installed (well, and whatever Twenty's come bundled). So I wouldn't think to show every available theme in the Appearance > Themes screen, it's a restricted set of things you've intentionally picked (installed on core, or recently used on wpcom).

In core, user would go to the "Add new" screen to see the full listing— which right now doesn't exist for simple wpcom sites, I assume due to permission issues. Working around the permissions issue might be a can of worms, but I don't know if we want to create a new wp-admin page for a theme showcase… I assume this is being discussed somewhere already, I'd like to help out too, just let me know where 🙂

[fditrapani]

Thanks @ryelle!

This is super simple and just adds a link to the Theme Showcase, as simple sites don't have the core theme-install view (yet).

That's great. Exactly what I was hoping we'd do!

Technically in core, this screen shows the themes you've installed (well, and whatever Twenty's come bundled). So I wouldn't think to show every available theme in the Appearance > Themes screen, it's a restricted set of things you've intentionally picked (installed on core, or recently used on wpcom).

I agree with this. To mirror core, we'd only want to show themes you've interacted with on this screen.

In core, user would go to the "Add new" screen to see the full listing— which right now doesn't exist for simple wpcom sites, I assume due to permission issues. Working around the permissions issue might be a can of worms, but I don't know if we want to create a new wp-admin page for a theme showcase… I assume this is being discussed somewhere already, I'd like to help out too, just let me know where 🙂

Taking people to the Theme showcase is the best bet here. What I'd love to eventually see done is for us to style the theme showcase so that it looks like Core. We'd obviously have a few subtle differences but the look and experience should mostly be the same. Once we have parity, then we can look at improving the core experience and brining those changes over to our theme case.

[Copons]

Update

Follow the conversation on P2! pfYzsZ-1i6-p2

[Copons]

Update

Project thread: pdL8AQ-10Z-p2

[Copons]

February 4 Update

pdL8AQ-10Z-p2#comment-1618

The work is progressing (Automattic/jetpack#41374 (comment)) to show all themes on wp-admin for all site types. A demo will be published soon! ✨

[Copons]

February 12 Update

The team has published a demo about the current WIP (pdL8AQ-13C-p2), sharing concerns about code duplication and increased tech debt.

[scruffian]

We are exploring how to ship this in smaller parts. The first one is here: Automattic/jetpack#41770

[crisbusquets]

@Copons In the PT (pdL8AQ-10Z-p2) I see @richtabor is working on the Design. Is this still correct?