search

WordPress / gutenberg

The Block Editor project for WordPress and beyond. Plugin is available from the official repository.
https://wordpress.org/gutenberg/
Other
10.27k stars 4.09k forks source link

Post content block: iterate on placeholder to help prevent removal and convey block's purpose #58136

Open annezazu opened 7 months ago

annezazu commented 7 months ago

As part of the broader discussion around the post content block removal warning https://github.com/WordPress/gutenberg/issues/52392, the post content block placeholder came up as something to improve to help address the problem of folks removing this block without understanding the impact. This ties into an effort a few years ago around block previews and placeholders for site editor blocks https://github.com/WordPress/gutenberg/issues/30029.

Pulling from the feedback in the post content block removal issue:

Add more visual distinction to the Content Block to indicate that it is a special block. this could be done by:

  • Using a special accent color, similar to how Template Parts and Patterns have a purple border and purple icons. Dynamic blocks like Content, Featured Image, Query Loop and Post Template Blocks could have the same accent color to distinguish them from “regular” blocks.
  • Add other visual cues like different background color/border or placeholder iconography to indicate that is a placeholder/dynamic block, similar to how the Featured Image block has a crossed-out grey background
  • Make the text inside the placeholder not selectable with a text cursor, so that it's clearer that is it not editable. This also applies to the Title Block. (h/t @supernovia)
  • If a user tries to highlight, delete, or type over the placeholder text, a modal can pop up with instructions on how to edit that section for individual posts/pages/CPTs. This also applies to the Title Block. (h/t @supernovia)

Curious what else folks have in mind and what we can do to continue to iterate cc @WordPress/gutenberg-design

jasmussen commented 7 months ago

Tiny PR for disabling text selection in #58169.

mrfoxtalbot commented 7 months ago

Yesterday alone, I encountered three different users who were struggling with this.

As well as adding visual queues, I would also suggest we lock the Query by default, as discussed in https://github.com/WordPress/gutenberg/issues/28779

I noticed that the Content block is already blocked by default. The Query block should do the same.

Locking these blocks will add one extra check/hurdle to prevent accidental removal as well as give a visual queue that these blocks are different from other blocks.

Experienced users would be able to unlock it, it would only take them a moment.