Universe offers two different blocks that group other blocks together. The Grid Block and the Stack Block. These Group Blocks are useful for designing more complex layouts with different groups of blocks to make each section and component. Imagine a menu as a group of buttons or a gallery as a group of images. Group blocks are powerful tools that allow you make your website more complex but also easier to work with.
What is Grid Block?
The Grid Block allows you to group together blocks in their own grid. The Grid Block works just like any other block with its own background, border, and spacing but it also has a full grid inside allowing you to position other blocks just like you do on your page's grid. Grid Blocks are perfect for create sections, modules, or components you want to move as one unit and duplicate around your website.
You can learn more about Grid Block here: Universe Basics: Grid Block.
What is Stack Block?
The Stack Block allows you to group together blocks into an organized but dynamic layout where each block stacks one after the other. The Stack Block also has its own background, border, and spacing but it positions the blocks inside according to the settings for your Stack Block. You can control minimum and maximum size for items as well as spacing between rows and columns of items. These controls allow you to influence how large each item in the stack is, how many fit on a row, and how you would like the items to adjust when the your website is opened on different size screens. Stack Blocks are perfect for creating collections, sections, and groups of related content.
You can learn more about Stack Block here: Universe Basics: Stack Block.
Which Group Block should I use for my site?
We recommend experimenting with both Grid Block and Stack Block so you are comfortable with both and can choose the right block for the job. But we are happy to share the differences between Grid Block and Stack Block as well as provide a few examples that might help you make the right choice for your website.
Best for Grid Block
- reusable elements
- static layouts that stretch
- sections that need their own background or border
Best for Stack Block
- collections of content
- dynamic wrapping layouts
- dynamic aligned layouts
- groups of content you will continue to add items to
How do I group existing blocks together?
While you can create a group block and add blocks to it sometimes it is easier to group existing blocks together into a new group block. Start by selecting one of the blocks you would like to group. Then tap multiselect from the block toolbar. Now select all the blocks you would like to group. Finally tap group and choose the type of group you would like to use.