Heading

Headings can help structure your page and make your content more readable by humans as well as search engines.

To add a heading, click on the Add Block button.

Detailed instructions on adding blocks can be found here.

The editor automates a search engine optimized layout by considering the page title is the <h1> tag, so subsequent heading blocks begin at <h2> and so on, but you can choose your heading level according to your style in the toolbar.

Heading selection

Block Toolbar

Each block has its own block-specific controls that allow you to manipulate the block right in the editor. The heading block offers the following options in its toolbar:

Heading toolbars.
The heading toolbar offers header tag selection, text alignment options, Bold, Italic, Hyperlinks, and more.

Align Options

The wide width and the full width align options are available.

All Heading Tags

You can choose the heading tag from the block toolbar.

Block Settings

Every block has specific options in the editor sidebar in addition to the options found in the block toolbar. If you do not see the sidebar, click the settings icon next to the Publish/Update button.

Heading Settings

If you look to the block settings in the sidebar, you can see the options to change the font size of your heading tag.

Styles

Default

Underline Header

Heavy Gold Underline

You can set a pre-set size for your headings from the block settings.

You can also set a custom color for your heading tags.

Accessibility

Headings levels (H1, H2, etc.) should be used to organize sections and subsections in a nested format similar to an outline. Using good heading structure with proper nesting, and not skipping levels, makes your content more organized and navigable for those using assistive technology, like screen readers. The main page title of your WordPress page will receive an H1, thus, all content should begin with H2. Clicking the Document Overview icon (that looks like three offset lines) in the top left of your editor, then choosing the Outline tab, will reveal your heading structure and provide warnings if your current structure isn’t accessible.

We understand that accessible heading levels don’t always fit your desired look for page layout. So we have provided the option to emulate the style of other heading levels with size and color in the heading block options.