Understanding Group block

What is Group block?

Block Group is a Shopify OS 2.0-standard block, used by Radian throughout sections with highly flexible, customizable content

The purpose of the Block Group is to make it easier to set up vertical or horizontal rows that you want to present

How it work?

In the Group block, there are the following options:

• Direction: Row / Column
• Horrizontal alignment: Start / Center / End
• Vertical alignment: Top / Center / Bottom
• Mobile layout: Row / Column
• Gap

To understand Direction, here’s how it works:

• Row: Content (the block within the Group) will be arranged horizontally
• Column: Content (the block within the Group) will be stacked vertically

HOW WIDTH WORK?

Within the blocks, there is a setting called Width, with the following predefined options: 25% / 33% / 50% / 66% and 100%

Suppose you have a Group set to width of 100%. In the Group block, there is a Text and Media block with the following settings

• Text: 33%
• Media: 66%

Here’s how it works

In case you set Media to 66% and Text to a value greater than 33%, it will push the Media block down to the next row based on the Direction you configured.