WordPress / theme-experiments

Experimenting with themes made out of blocks.
GNU General Public License v2.0
546 stars 179 forks source link

Feedback on creating a blank template and spacing #263

Open annezazu opened 3 years ago

annezazu commented 3 years ago

Problem

When creating a brand new custom template using template editing mode, each default block that comes with the blank template is aligned left and runs directly against the very side of the site. There are two problems here: the editor and front end show different views and, in some cases, this issue can't be fixed. For example, if you add a full width columns block, the only way to fix the problem is to either center alignment or add a background color. This was originally raised

I know there is work underway to add padding but, for now, wanted to pass along this feedback as the user experience is currently pretty rough out of the box. This is part of feedback from WP Tavern's coverage of the sixth call for testing with the FSE Outreach program:

When inserting a full-width Columns block, the text on the left butted against the side of the page. Because neither the Columns nor the inner Column blocks currently have padding controls, the only way for users to “fix” this is to add a background color. Gutenberg automatically adds padding in that case.

Visuals

Video talking through this experience: https://user-images.githubusercontent.com/26996883/118719108-481a2980-b7e5-11eb-92a9-e35864b5589d.mov

Editor:

Screen Shot 2021-05-18 at 2 28 37 PM

Front end:

Screen Shot 2021-05-18 at 2 28 17 PM
jffng commented 3 years ago

👋

It seems like there are two issues here:

  1. The template editor and front-end don't match. I think this is a Gutenberg issue...
  2. The content has no default alignment

Regarding 2, for the content to be aligned to the default width, it needs a container — like a group block:

Screen Shot 2021-05-18 at 6 20 53 PM

When a new template is created, there is no container block, causing the contents to appear full width. If the theme can do something to provide a default wrapper here for this flow, I'm not aware of it.

There have been related discussions to turn this on by default, but it ... gets tricky 😄 https://github.com/WordPress/gutenberg/issues/29983