Icon Grid

To add an Icon Grid block, search for “Icon Grid” in the block search or locate the Icon Grid block. Select the Icon Grid block.

The icon grid outlined in red in the block inserter.

The Icon Grid editor will open with a default of three Icon Grid Items. To add more grid items, click the plus sign at the bottom of the block editor.   

Icon Grid with the plus sign to add another icon grid item.

To add content to a grid item, click on one of the Icon Grid items. Inside, you can add the Icon class, Title, and an optional description.

Icon grid fields

You can search for different icon options from the Font Awesome Icon list. Once you’ve found an icon you like, copy the class name and paste it into the Icon Class field.

Add text associated with the icon in the Title and Description fields.

To create a link using the icon, click on the grid item and go to the inspector panel on the right. Toggle the “Clickable icon” option on and add your URL in the text box below.

View of the Icon Card block settings with the clickable icon link option outlined in red.

Icon Grid Example

SunnySometimes the sun is shining
CloudySometimes it’s overcast
RainSometimes it rains