Gutenberg blocks go nested!

Update June 19, 2018.

The early iteration of nested blocks turn out to have a few issues. And some of them will be resolved when Andrew Duthie finishes his work on the pull request:  “Blocks: Render columns as nested column (wrapper)” 41172652-83195ff0-6b22-11e8-98eb-c417771c4c14 February 16, 2016

WordPress content creators have been waiting for it since Gutenberg was announced: nested blocks. You can now create multi-column layouts and include pictures and add other blocks into those columns. On February 6th, Andrew Duthie’s Pull Request (PR) was merged to the master branch of Gutenberg. The new version Gutenberg 2.2 was released today. Matias Ventura in his announcement for the new release, labeled this  particular features as “experimental” It would still need further work and has some browser hiccups. Keep this in mind when you start working with it

From the PR comments we learned: [Now there is] a new Columns block which behaves similarly to the Text Columns block, except that it allows insertion of blocks within the rendered columns.

We tested it earlier this week with the master dev build version on our local development environment. Here is a short view.

https://youtu.be/HqPciy5MrPE

It still feels a little rough around the edges for different browsers or with the alignment on the front-end. Minor quirks that will be fixed in later iterations, I am sure.

For Developers

Developers building custom blocks can also use nested blocks and restrict the type of blocks that can be added to their block. For instance, a team member block can only have an image, a heading and a paragraph, but the user would not be able to add an embed block or a gallery block.

Andrew explained the various API changes for nested blocks as well as the limits for this first iteration of nested blocks in his comments from February 6th. 

Photo by Dmitri Popov on Unsplash