Columns Block: Allow to Have One Column

[iamtakashi]

I often need to make a design like this example where a heading spans across the wide width.

But adding a Heading block straight would result like this.

This is because the Heading block doesn’t have the width setting like other blocks at the moment. So I need to use the column block that is set to the wide width. And the minimum column number in the block is 2, so what I need to do in the end is to set one of the columns to 99% width, and the other to 1% so that the larger column would take most of the wide width.

While this gets the job kind of done, it’s really not ideal. Also, we see the empty column hanging around in the editor, and that's confusing for people who are editing the page. (I think I’ve seen this method was used in one of the block patterns in Gutenberg that had a large text saying “it’s time” at one point.)

There might be a better workaround or Gutenberg has already a better plan to accommodate this need, but otherwise, it could be a welcome addition to the block.

[richtabor]

I agree. Typically I'd suggest using a Group block as essentially a single column block, though adding blocks within it can't always be aligned fullwidth/wide - which results in a frustrating experience trying to better align content within columns.

We found that folks use the single-column functionality in the CoBlocks Row block quite substantially.

[mtias]

Agreed! These micro-annoyances are fairly evident in the site editing context where you don't want to be constrained by the main column width all the time. I think working with a single column is a fine approach given the current limitations, but I'd love to arrive at better layout support that doesn't require so many hops and theme support.

cc @nosolosw @youknowriad @ellatrix @jorgefilipecosta for past conversations about similar issues.

[kjellr]

@melchoyce opened this similar issue recently. Same result, but different tactic: #25655

[youknowriad]

It seems the Group block should be the solution for this but the fact that the group block has a "centered" area by default prevents it from being used to achieve that example above.

We've discussed several times with @jasmussen that the group block, by default, shouldn't have the "centered" area, basically, blocks inside it should expand their width automatically (like divs inside divs). But this only works if the inner blocks inside that particular group block forbid things like "wide" and "full" alignment as they don't make sense anymore.

We've also discussed this but the solution seems related to how a "container" block (or InnerBlocks) define the allowed alignments inside it, I see these things

• A column block should probably forbid all alignments inside it by default
• A group block instance could say: by default blocks are centered by I do offer wide and full alignments
• Another group block instance (default behavior) could forbid wide alignments inside it and have its content expand automatically.

Now, the question becomes about API, what does an API to define supported alignments in InnerBlocks and the default alignment applied to these blocks look like? And how to style these alignments properly (Wide inside a single column layout could have a different style from "wide" inside a two columns layout and the editor should be able to do both at the same time, so how to "declaratively" generate these styles)?

[jasmussen]

I think working with a single column is a fine approach given the current limitations, but I'd love to arrive at better layout support that doesn't require so many hops and theme support.

It seems the Group block should be the solution for this but the fact that the group block has a "centered" area by default prevents it from being used to achieve that example above.

These two separate statements both get at the core issue: it's weird that you can't use the group for this, but since that's the case, allowing a single column in the columns block could be a nice holdover.

I would add my support to both those statements, if enabling a single column in the columns block unlocks good things, go for it. But at the same time, the Group feels the right tool for this.

A group block instance could say: by default blocks are centered by I do offer wide and full alignments

I think this is smart. I'd like a "dumb group" by default, but I'd be fine with having an option on a full-wide group block to toggle a centered column inside.

[talldan]

A column block should probably forbid all alignments inside it by default

Just to add some weight behind this kind of API, there's a similar use case in the navigation block where Social Links can be set to full width inside the Navigation block (which also has alignment settings) - #25016 (comment)