The paragraph block is probably the most commonly used block in Gutenberg and your WordPress site, you’ll use this the most in your affiliate site.
Table of contents
Color
For each block of paragraph text, you have the freedom of choosing the text color, background color, and link color.
You can choose any color you like in all paragraph blocks throughout your site.
You can even choose a background color.
Or if you have a link in your paragraph, you can select the color of that as well….
Or a combination of all the above 👀
Note: that the block options are shown on the right in the Block Options when your block is active in the editor.
Typography
Typography options are configurable on each paragraph block item meaning that you can have multiple typographies per each post.
Font
Choose your font here.
Size
You can choose from the default fluid typography options or set a size manually in px, em and rem.
Appearance
Select a font weight for your paragraph block.
Line height
Select the line height, default is 1.5.
Letter spacing
Choose the amount of spacing between characters.
Decoration
Choose from:
None
Underline
Strikethrough
Letter case
None, this is default.
Uppercase – Makes everything Uppercase.
Lowercase – makes everything lowercase
Capitalize – capitalizes all first characters of all words in that block
Dimensions
Padding
Padding will add space within your paragraph block. The easiest way to see how this works is to add a background color.
You can set padding in px, em, rem, or the default slider will use Presets.
You can set top, right, bottom, and left padding individually by pressing the unlink button.
Margin
Margin will add space outside your paragraph block. This allows for space between blocks/elements on your page or post.
As with padding, you can set top, right, bottom, and left padding individually by pressing the unlink button.
Advanced
HTML Anchor
The HTML anchor field allows you to ad IDs to your paragraph blocks, you can link to these directly from anywhere on your site. For example if you had the IS of some-html-anchor on your element, you can link to that with your page address followed by #some-html-anchor
For example:
https://someamazingwebsite.com/your-amazing-post#some-html-anchor
Additional CSS Class(es)
You can add your own CSS classes to your paragraph block here. Classes should be separated by a space.
You can add your own class(es) and target them in your own CSS.
Leave a Reply