Wrapper elements around blocks

[joyously]

A user could want to select multiple blocks and wrap a div around them for styling. I haven't heard any discussion about block level controls to "group" and "ungroup" blocks. It is difficult in this editor because it's all about what you can see, and a grouping block isn't seen. But it should be able to be styled.

A test scenario is a user has written his sales page, and now wants to jazz it up.
Select some text and a list and make it into a bordered box with background color floating right. (Styles not included, just add a user class name, or maybe an interface to the Additional CSS option?)
Select the paragraphs and price button and group to give it an ID for a script to hide until video is played. Change your mind, and remove the group div.

The "clearing" block fits into this category of unseen but styled, also. It should be one of the selections the alignment toolbar as well. I don't know whether it's useful to break it into clearleft, clearright, clearboth, or just always clearboth.

[jasmussen]

One way to solve this would be to create a "Box" block, which simply wraps content that you insert. This box could then have custom CSS classes and other attributes you might like to add to this, like columns or various alignments or position modifiers.

For the first release of the editor, I suspect this will be out of scope, but it could definitely be interesting for the customization focus later in the year.

[aduth]

Likely would play into ideas around allowing nested blocks. Not quite the same as columns, but similar requirement.

[mrwweb]

This is related to #645 ("freeform block" discussion) in that there's clearly a need to be able to work with text that's grouped to span more than one paragraph and may include image, embeds, etc.

While maybe not obvious at first, we also should think about one of the common compatibility problems with page builders raised by Pippin Williamson is his oft-cited review of them:

Second, we see site owners often try and use opening and closing shortcodes across page builder elements. This is common with the restrict shortcode in Restrict Content Pro. A lot of page builders are not able to adequately support opening and closing shortcodes when they are placed in different rows or columns in the builder.

That seems pretty darn reasonable, especially with a plugin like Restrict Content Pro that has shortcodes for conditionally hiding any piece of content.

Of course, this new editor suggests there are other ways this could be handled. Maybe the plugin registers a Freeform block that's restricted by default or adds a "lock" button to every block to hide it from the public (though that would get cumbersome if hiding a majority of a page).

@joyously's example was my concern that lead me to this ticket, but it raises some other thorny questions too.

[jasmussen]

Thorny indeed, though I think the nature of the architecture of gutenberg will make it impossible for a single shortcode to span multiple blocks. That is, it should be impossible to, for example, write:

<textblock>
[shortcode]
</textblock>

<galleryblock>
...
</galleryblock>

<textblock>
[/shortcode]
</textblock>

It's my understanding that this would trigger a parsing error by the editor in blocks 1 and 3, but not 2, therefore the need for #214.

My understanding of this ticket was more in the vein of nesting. For example:

<wrapperblock>

	<textblock>
	...
	</textblock>

	<imageblock />

</wrapperblock>

You'd then be able to, perhaps, set the wrapper block to be full-width, then float the contents inside perhaps, creating a fun layout. Which is a cool feature, and definitely something to look at with the customization focus later in the year.

[mrwweb]

the nature of the architecture of gutenberg will make it impossible

Good to know.

My primary point is just that in the current page builder world, people sometime needs shortcodes to span multiple blocks, so understanding why and providing alternate ways of achieving the same end feel important. Starting to get some plugin developer eyes on this would probably be good to that end.

My understanding of this ticket was more in the vein of nesting.

This ticket probably should be limited in scope to that. Make sense.

[mtias]

We'll get to these in the next iterations of the editor once we have nested blocks, boxes, columns, etc.

[AICanary]

am trying to put first three blocks in one div but it's not working any help? http://psd2wordpress.co.uk Shopify free landing page in WordPress I am building