-as of [25 MARCH 2025]-
.
.
*SYMBOL* —>
.
*[BLOCK INSERTION] EDITOR SCREENSHOT* —>
.
*CONTROLS* —>
The Grid block is a container for other blocks.
Use it to organize multiple blocks and adjust the color, text style, height, width, and position of all blocks inside the container.
This block is a variation of the Group block.
In this guide
Video: Master WordPress Grid Layouts
Add the Grid Block
You can start with a new, empty Grid block or group existing blocks into a grid.
Add a New Grid Block
To add a new Grid block, click the + block inserter button and search for “grid”. Click it to add the block to the post or page. Using your keyboard, you can also type /grid on a new line and press enter to quickly add a new Grid block.
The block inserter has been clicked, the user has searched for “grid”, and the grid block is shown.
Adding a new Grid block
For more information, visit our detailed instructions on adding blocks.
After adding a Grid block, click on the + block inserter icon to start adding blocks inside the grid.
Place Existing Blocks Into a Grid
For blocks already on the page, you can combine them into a Grid block using the following steps:
Select the blocks you wish to group together. You can select multiple blocks using one of these options:
Clicking and highlighting the blocks with your mouse.
Clicking the first block, then holding down the Shift key on your keyboard and clicking the final block to select all blocks between the first and last block.
Using ListView, click the first block, hold down the Shift key on your keyboard, and click the final block to select all blocks between the first and last block.
In the block toolbar that appears above or below the blocks, click on the Grid icon to add the selected block into a new grid:
An arrow points to the group icons in the block toolbar.
The Group icons in the block toolbar for a Group, Row, Stack, and Grid
Grid Block Toolbar
When you click on the block, a toolbar of options will appear:
The Grid block toolbar.
The Grid block has the following options in the toolbar:
Change block type or style.
Drag the block.
Move the block up or down.
Change alignment: none, wide width, full width.
More options.
Grid Block Settings
When you select a block, you will find additional block settings in the right sidebar. If you do not see the sidebar, you may need to click the Settings icon in the top-right corner to bring up the settings. This icon looks like a square with two uneven columns:
An arrow pointing to the “Settings” icon in the top right of the WordPress Editor.
Click the Settings icon to open the block settings
The Grid block includes include the following block settings:
Transform to Another Group Variation
The Block Settings sidebar showing the Grid block highlighted, along with the options to switch to a Group, Row, or Stack block.
Layout
In the Layout settings, you can choose the number of columns in the Grid block, based on whether the column widths are automatically or manually sized:
Selecting Auto will automatically add columns of the specified minimum width to fit the block.
Selecting Manual will automatically divide the block into the number of columns you specify.
Similar to the Columns block, the number of columns in the grid can be defined by setting a minimum column width or by manually setting the number of columns.
When you place an element like a Paragraph block inside a Grid block, you can define how many columns and rows this element should span. Adjusting these dimensions for each element allows you to create customized grid structures.
To edit the dimensions of an element inside a Grid block:
Select the element within the Grid block whose dimensions you want to edit.
Under “Dimensions” in the block settings sidebar, change the number of columns or rows the block spans.
The Dimensions setting for a Paragraph block inside a Grid block.
Column and row span settings for a Paragraph block in a Grid block
You can also drag the handles of an element (like a paragraph block) to change the column and row span.
Below is an example of a Grid block with multiple Paragraph blocks set to varying column and row spans:
2 columns / 3 rows
3 columns / 2 rows
1 / 1
1 / 1
2 columns / 1 row
2 columns / 1 row
Position
Using the Position setting, you can choose between Default and Sticky:
Default: When you scroll past the block, it will disappear as you move to other sections of the page.
Sticky: The block will float and stay visible on the page, even when you scroll past the position where it was originally added. A pin icon will appear next to the block in List View.
Learn more about creating a sticky element.
The Position option in the Block Settings sidebar.
Advanced
For more information, visit our detailed instructions on Advanced Settings.
Grid Block Styles
In the block settings sidebar, click on the Styles icon to access the design settings for the block. The Styles icon is in the shape of a circle with half of the circle filled in:
An arrow points to the Styles icon that you can click to open up the block styles section.
Color, Typography, Dimensions and Border
Here, you can set the text color, background color, text size and fonts, padding, margin, and block spacing. See the following guides for more details on how to use these settings:
Color Settings
Typography Settings
Dimensions Settings
Border Settings
Background Image
In the Grid block styles, as with all of the Group block variants, you can set an image to display behind the block’s content. The Group block guide provides step-by-step instructions on adding a background image.
Remove Blocks From a Grid
If you wish to remove a Grid block without erasing the inner blocks within, you can ungroup the blocks instead. Follow these steps:
Select List View at the top of the editing screen.
Select the Grid block.
Click the three dots next to the Grid block
Select the “Ungroup” option.
GIF showing the action of selecting Ungroup in the block toolbar.
wordpress.com /support/wordpress-editor/blocks/grid-block/
Grid Block —
6-7 minutes 4/2/2024
.
.
*SKETCHES*
*.
.
☜*“WORDPRESS SPECIALTY BLOX”* ☞ 
.
.
.
.
*.
.
