Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Site Editor → Page Inspector: Add ability to switch templates #51347

Closed
jameskoster opened this issue Jun 8, 2023 · 2 comments · Fixed by #51477
Closed

Site Editor → Page Inspector: Add ability to switch templates #51347

jameskoster opened this issue Jun 8, 2023 · 2 comments · Fixed by #51477
Assignees
Labels
[Feature] Site Editor Related to the overarching Site Editor (formerly "full site editing") [Type] Enhancement A suggestion for improvement.

Comments

@jameskoster
Copy link
Contributor

jameskoster commented Jun 8, 2023

Here's the page inspector that can be accessed when editing a page in the site editor:

Screenshot 2023-06-08 at 15 44 40

It details which template the page uses, and provides access to edit that template.

What is missing is a way to switch templates.

We can potentially reuse the "Choose a pattern" modal that appears when creating pages / templates, and display the options therein.

Screenshot 2023-07-07 at 13 45 15

Initially the modal would include any existing $custom page templates as options, and in the future might be enhanced to include a way to create a new template on-the-fly based on patterns.

cc @WordPress/gutenberg-design

@jameskoster jameskoster added Needs Design Feedback Needs general design feedback. [Feature] Site Editor Related to the overarching Site Editor (formerly "full site editing") labels Jun 8, 2023
@jasmussen
Copy link
Contributor

Makes sense and seems worth trying. Reviewing the elements, there's a panel title (Template), a template title (Page), a thumbnail (unclickable?) and two buttons with somewhat long titles. I wonder if we can reduce and simplify a bit. Can we simply add a "Swap" button next to the template title? Perhaps even an icon button?

An entirely different approach is to go more visual like I think we're scheduled to do for Template parts, and have the first part of the Template panel be "Page [Edit]", followed by a "Templates" subheading, listing each available template to transform to as a thumbnail? The active one can be highlighted with a border. The main question there is deciding which templates you can transform between. If it's "Page" or "Page with Sidebar", it's one thing. If it's from "Page" to "Archive", it's another question.

@jameskoster
Copy link
Contributor Author

Indeed, the "Swap template" button is the simplest possible execution, making use of existing functionality to get the feature in and achieve parity with the post editor.

But I agree that the panel could use more considered design attention, either here or in a follow-up. Another missing feature we should take into account in such an exploration is the ability to create a new template.

listing each available template to transform to as a thumbnail?

I think there may be room for both. A list is nice because it feels quicker / more lightweight. But if you have lots of templates it begins to feel a bit cumbersome. For more than a handful of options the modal offers a better browsing experience.

One idea could be to offer a way to browse via modal, but only reveal it when more than X templates are found.

The main question there is deciding which templates you can transform between

Yes it's probably good to nail down this technical detail. For the first iteration it probably makes most sense to only include $custom templates.

Surfacing contextual patterns, or offering the ability to 'clone' an existing template may be better suited to the aforementioned "Add template" flow.

@ntsekouras ntsekouras self-assigned this Jun 13, 2023
@github-actions github-actions bot added the [Status] In Progress Tracking issues with work in progress label Jun 14, 2023
@jordesign jordesign added the [Type] Enhancement A suggestion for improvement. label Jul 18, 2023
@annezazu annezazu removed the Needs Design Feedback Needs general design feedback. label Jul 25, 2023
@mikachan mikachan removed the [Status] In Progress Tracking issues with work in progress label Sep 29, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Site Editor Related to the overarching Site Editor (formerly "full site editing") [Type] Enhancement A suggestion for improvement.
Projects
Status: Done
Status: Done
Development

Successfully merging a pull request may close this issue.

6 participants