It is common knowledge by now that blocks are one of the crucial elements in Gutenberg. Everything that you build with Gutenberg can be accomplished using blocks. Nested blocks are a really useful feature in the Gutenberg editor. Gutenberg uses nested blocks in Columns, Cover, and Group blocks.
What are Nested Blocks in Gutenberg?
Nested Blocks mean a block that can be added or exist within another block. Thus, we are implying blocks that are usable as sub-blocks of existing ones. There is also a concept of child and parent blocks, child blocks are still a relatively newer addition to Gutenberg.
you can work with additional forms of content and get better formatting for presenting your content on the front end. It can help in the layout and structuring of your content on the front end as well.
How Do Nested Blocks in Gutenberg Work?
To nest a block within another block, we need two things:
- Sub-blocks that can be nested under another block.
- A primary block that allows other blocks within its fields.
The Benefits of Nested Blocks:
The concept of child blocks and nested blocks can be used to present content in a better and more organized manner.
Nested blocks make it easy to create advanced layouts and edit the content on the backend.
Examples of Nested Blocks In Premium Blocks
- Content Switcher Block
- Container Block
- Team Member Block
- Bullet List Block
- Testimonial Block
- Section Block
- Pricing Table Block
- Icon Box Block
- Count Up Block
- Accordion Block
When click on any block inside nested blocks, it shows the block settings and controls.
you can use the “List View” at the top of the Gutenberg screen. This is the best way to understand your block layouts. If you click on the three lines of the “List View” icon, you’ll see an overview of all the blocks in your post.
As you can see, the concept of child blocks and nested blocks in Gutenberg can be used to present content in a better and more organized manner. This can help in the proper structuring of the content for the front end as well as easier editing of content on the back end.