Wp-calypso: Theme Showcase: Link to theme demo directly from showcase page

[kathrynwp]

Currently, it takes two clicks for a user to reach a standalone theme demo site from its showcase page.

1. Click "Open Live Demo"

1. Click "Visit Site"

It would be more ergonomic, fast, and efficient to offer people a one-click way to get to the demo, the way we used to in the old showcase. I'm just not sure what the best solution would be - I hesitate to suggest an icon, since I'm not sure that's widely understood (related: #20661). Open to suggestions - maybe change the current "Open Live Demo" link to say "Preview Theme" and add another link next to it that says "Visit Demo"?

@Automattic/editorial

[ehti]

So love this suggestion.

For me personally, two clicks really can be frustrating when all you want is to open the demo in a tab or window of its own.

Just because of this reason I often use the old showcase.

[michelleweber]

One click for the win, but I feel like "open live demo" and "preview theme" are too easily confused; they sound like they should basically be the same thing. A user, esp. a new one, doesn't know anything about modals vs. external sites.

Personally, I think that link should automatically take you to whatever page we want you to end up on. It seems to me like that would be the modal, as it still allows you to click around the theme but also encourages you to try the theme out and keeps you in the customizer universe, which hopefully pushes you to engage and buy; in that case, I'd keep the link as is, and change the button to "View full demo site," which lets people know that there's more they can see if they'd like.

But maybe there are reasons I don't know that we'd want to push people to the external demo site, I don't know. This is just my impression.

[zoeth]

Having just tried to visit a theme demo from the theme showcase, It seems that it no longer takes two clicks, but that the link simply isn't there! I have filed an issue regarding this here: https://github.com/Automattic/wp-calypso/issues/20889.

[pauloeaquino]

To further add to @zoeth's comment, I also recently noticed that the option to "open in new window/visit site" is no longer available. I was wondering whether this was intentionally removed or it's a bug.

[designsimply]

In the Reader, it's possible to cmd+click a post title to open it in a new tab but I tried that for the Open Live Demo link for a theme showcase page and it didn't work. @shaunandrews could the "Open Live Demo" link be updated to work the same way cmd+clicking title in the Reader works?

^{Seen at https://wordpress.com/theme/mellow using Chrome 63.0.3239.84 on Mac OS X 10.13.1.}

[davidakennedy]

👍 on this change. If no one jumps on this in the next day or two, the Theme Team can get this done.

cc: @mendezcode @mapk

[lancewillett]

Let's bring back the external link in the overlay preview window — I don't think we should assume everyone knows how to "Command-click" (Mac) or "Control-click" (Windows) to open in a new window/tab.

Thanks to @kriskorn for bringing this back up today.

[lancewillett]

Here's a quick visual of how it used to be — let's add it back there.

[lsinger]

The rationale behind removing this link was as follows:

a) The "activate this design" / "upgrade to activate" and "visit site" links together do not fit on mobile.
b) People who want to open the demo site for a theme in a new tab are likely to be capable to know about Meta+click.

Since https://github.com/Automattic/wp-calypso/issues/20664#issuecomment-365047411 assumes b) to be false, let's find a solution under the constraint posed by a) — i.e., mobile. Let's also keep i18n / differing string lengths in different languages in mind.

Adding the external link icon could be one solution. Then again people would need to know the meaning of that — I'm not sure whether we can assume that.

/cc @shaunandrews

[kathrynwp]

One solution could be to show the text & icon on larger screens, and icon only on small screens.

[ianstewart]

Currently, it takes two clicks for a user to reach a standalone theme demo site from its showcase page

Is reaching the standalone demo site (in another tab/window? In the same one?) something a lot of users want or need to do? If so, do we know why they would want to do that?

[lancewillett]

@ianstewart No, this is for HE workflow mostly. I've advised HEs to use "Command-click" on the link to make it open in a new tab as a workaround.

For customers — from an experience standpoint, I'd prefer they stay "in-app" and use the preview, as that is less forking to the flow of setting up the theme.

[lancewillett]

After showing Kris the Cmd-click trick, seems like that's a good enough workaround for HEs for now. Re-closing.