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

Manage Reusable blocks without leaving Gutenberg #26408

Open
paaljoachim opened this issue Oct 22, 2020 · 3 comments
Open

Manage Reusable blocks without leaving Gutenberg #26408

paaljoachim opened this issue Oct 22, 2020 · 3 comments
Labels
[Feature] Synced Patterns Related to synced patterns (formerly reusable blocks) [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). Needs Design Feedback Needs general design feedback. [Type] Enhancement A suggestion for improvement.

Comments

@paaljoachim
Copy link
Contributor

paaljoachim commented Oct 22, 2020

Bringing the Manage Reusable Block into the Gutenberg screen.
Looking at the current method there is a manage reusable block link in the Inserter panel.

Here is an example of the Reusable block inserter panel:

Screen Shot 2020-10-22 at 23 52 13

Clicking Manage all reusable blocks
exits the Gutenberg screen, and goes here

Screen Shot 2020-10-22 at 22 18 38

It would be a lot more helpful to have editing happen inside the Gutenberg screen. Making it possible to turn on and off managing Reusable blocks. The design suggestion I made still keeps it associated with the Inserter panel. It would be very helpful to keep the association in place. Keeping managing reusable blocks close to where we already insert the block into the layout.

Clicking Manage all reusable blocks
Could instead just show the Edit l Trash l Export links like so

Screen Shot 2020-10-23 at 00 03 00

Opening it up directly in the same Reusable inserter panel.

Here is a prototype that I made in figma.

https://www.figma.com/proto/bV0gCaIWKHtjidtus3WwJU/Reusable-block-manage-screen?node-id=1%3A2&scaling=min-zoom

A walk through animated gif.
Manage-Reusable-Blocks

@talldan talldan added [Feature] Synced Patterns Related to synced patterns (formerly reusable blocks) [Type] Enhancement A suggestion for improvement. Needs Design Feedback Needs general design feedback. labels Oct 23, 2020
@paaljoachim
Copy link
Contributor Author

Here is one way to handle trashing a reusable block. Draft would also be added here.
Look at the flow. The placement of the All l Published l Trash options are likely not ideal. This though gives an idea of what it might look like.

Here is another animated gif.

Trash-Restore-Reusable-Block

To test the prototype: https://www.figma.com/proto/bV0gCaIWKHtjidtus3WwJU/Reusable-block-manage-screen?node-id=1%3A2&scaling=min-zoom

@paaljoachim paaljoachim added the [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). label Oct 27, 2020
@paaljoachim
Copy link
Contributor Author

paaljoachim commented Nov 10, 2020

Next version. This time with an overlay.
An overlay can be used to show Reusable blocks, patterns, template parts, template sections etc in a bigger area.
User clicks either the manage link or the expand icon to open the Overlay.

Manage-Reusable-Blocks-overlay-1

Clicking the checkbox next to an item will show the options Edit l Trash l Export below.

Manage-Reusable-Blocks-overlay-2

I am just adding the below here as this is a very interesting feature.
This plugin adds a way to convert reusable blocks into patterns: https://wordpress.org/plugins/reusable-blocks-extended/

Here is a pattern modul/overlay suggestion which is very much associated to this Reusable blocks modul issue: #26905

@noisysocks
Copy link
Member

Related to this is that one cannot remove a reusable block from the trash from within the editor.

See https://core.trac.wordpress.org/ticket/51535.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Synced Patterns Related to synced patterns (formerly reusable blocks) [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). Needs Design Feedback Needs general design feedback. [Type] Enhancement A suggestion for improvement.
Projects
None yet
Development

No branches or pull requests

3 participants