Advanced Heading

Advanced heading block allows you to add a combination of a heading and a sub-heading with a separator in between.

How To Add The Advanced Heading Block

  1. Open a page or a post and click on the plus icon to add a new block and look for the Advanced Heading block or you can search for it if it doesn’t pop up quickly for you.

  2. By default, you'll get one header and a text element.

How To Configure The Advanced Heading Block

General

Alignment - Adjust the alignment of the content to left, right, or center. You can choose different alignments for tablet and mobile devices.

Heading - Toggle button to display/hide heading.

Subheading - Toggle button to display/hide subheading.

Separator - Toggle button to display/hide separator between heading and subheading.

Heading tag - Select the HTML tag for heading as H1, H2, H3, H4, H5, H6.

How To Style The Advanced Heading

Typography

Under the Typography tab, options for font family, font size, font-weight, line-height, letter spacing, and color are available for Heading and Sub-Heading.

You can set responsive Heading font size for Mobile and Tablet view.

Colors and Decorations

Heading Color- You can set the color of the heading.

Subheading Color- You can set the color of the subheading color.

Heading Text Decoration- You can choose from options like underline, overline, and line through to decorate your header.

Subheading Decoration- You can choose from options like underline, overline, and line through to decorate your subheader.

Separator

Position - You can select the position of the separator from here.

Style - You can select the style of the separator between heading and subheading as solid, dotted, dashed, etc. You can also choose to hide it.

Thickness - You can adjust thickness to the separator from here.

Width - You can adjust the width of the separator in pixel or % from here.

Color - You can choose the color of the separator from here.

Spacing

Spacing tab offer options to customize the spacing for the block.

Heading Bottom Spacing - Adjust the bottom margin of the heading. Separator Bottom Spacing - Adjust the bottom margin of the separator. Text Bottom Spacing - Adjust the bottom margin of the subheading.

Last updated