Isotoop for Gutenberg

How to apply to Gutenberg

1 Add a block

Install this plugin:
Insert Headers and Footers WP Plugin

2 Go to Advanced Block setting

• Go to the plugin settings of the Insert Headers and Footers WP Plugin
• Block > Advanced > Additional CSS class(es)
• Add a code in the field

Simple text styles

Text styles always start with “t-” followed by a value like “n” (normal) or “l” (large)

For example: font size

Text size: Large

t-l

Font color: medium red

t-red07

Font color: dark red

t-red11

Spacing

Add padding. This is the spacing within the Gutenberg Block

p-n

Add margin. This is the spacing outside the Gutenberg Block

m-n

Make combinations

You can combine all styles like colors, typography and spacing.

t-l t-red09 red02 p-n

In the example above the result will be:
Large text, dark red color, light red background, normal spacing around the text inside a Gutenberg block