•
•
The basic grid block allows you to create a simple grid of items. This can be really helpful in showing off a list of features for a product or service or a list of services that you offer. And you can control how many columns are shown at mobile, tablet and desktop screen sizes.
If you want to show a grid of posts in a query, you’ll still want to use the query loop block and select the grid option.
Settings/Attributes
- This block has a child/inner block (basic grid item) that uses all of the spacing (margin/padding/block spacing), colors, borders and typography settings.
- Attributes
- Number of Desktop Columns – the number of columns shown on desktop screen sizes.
- Number of Tablet Columns – the number of columns shown on tablet screen sizes.
- Number of Mobile Columns – the number of columns shown on mobile screen sizes.
- Grid Gap – the amount of space between items in the grid.
How to use this block
The basic grid block is pretty simple to use. When you add the block to your content, you’ll want to set the number of columns for each screen size. Then you can start adding in your grid items.
You can also customize the number of rows and columns a grid item takes up on desktop, tablet and mobile screen sizes. Just make sure that the numbers add up for the correct number of columns used by grid items.
When you add a new grid item, the block will add in a basic grid item block. This block acts like a group block, but it also comes with vertical alignment options: normal, top, center, bottom, equal spacing and aligning the last item at the bottom. This block also has all of the spacing, color, typography and border settings as a group block.
Tags: