Gutenberg: Allow width controls on every block

Created on 9 Oct 2020  路  4Comments  路  Source: WordPress/gutenberg

25147 and #25917 have surfaced that the limitation of wide and full-wide widths to primarily the big decorative blocks is a little arbitrary, and that allowing these widths on every block can enable some designs, layouts, and patterns that would be desirable.

Allowing those widths on every block do not preclude explorations into refactoring alignments and layout features, but should be seen rather as a bit of consistency across the controls.

So as to not explode the width of block toolbars, wide and fullwide controls should probably not be part of the block toolbar of every block. The heading block just fits it, but the list block would not:

95430817-982a3700-094c-11eb-9043-1eb4331ea853

For that reason, the width controls should probably default to living in the block inspector, and then for blocks where it remains a primary action, they could be in the block toolbar. For the Paragraph block, for instance, the width controls are definitely secondary, whereas for an Image, it remains a primary interaction.

[Feature] Blocks [Type] Enhancement

Most helpful comment

Another thing to ensure is for context / themes that don't have wide / full width that the whole control should not render

All 4 comments

@jasmussen What are your thoughts on blocks like navigation link, social icon and button?

I feel like these inner blocks that are styled more as inline elements might be the exception to the rule of adding these controls everywhere.

Oh excellent point, it makes no sense for those innerblocks. I suppose we'll still want to keep the opt in or out and balance it on a per-block basis. Though instead of, as we've done now, reserve it for very few, just be inclusive of blocks instead.

Another thing to ensure is for context / themes that don't have wide / full width that the whole control should not render

I wanted to note that I've heard feedback from a number of developers frustrated that the code block is limited by the width of the main column. Especially for debugging long lines of code, and in absence of wrapping, that quickly gets frustrating. Allowing wide and full-wide options on that block would alleviate a fair bit of that frustration.

Was this page helpful?
0 / 5 - 0 ratings