Heading Title

Heading Title

Heading title is used to display heading & subheadings for any content with many design options provided by us.

Most of the content in a web design start with having section title & short relative description followed by content. We have provided some default designs to make your heading and subheading look nice and can modify in a way that suits your design theme.

Pro tip
I don’t know any pro tip on this, you’re gonna use it anyway.

Configuration for Heading Title

Heading title contains the Main title, subtitle and some extra text options along with both of them. With that, we have also provided letter limit and fetching page title options too. So you can use it in the most dynamic way.

How to use the Heading Title block of The Plus Addons For Gutenberg

The Heading Title block comes with multiple functions. Let’s understand how to use this block in the tutorial below.

Table Of Contents

Setting up

Gutenberg gives multiple ways to add Heading Title into the content building area or we say playground. Check for the “+” icon in the top toolbar or click the “+” icon in the content area or start typing Heading Title after “/” sign, eg.“/Heading Title”, in the content area. Gutenberg also provides drag & drop after opening the list of blocks panel.

After placing the block you’ll see three tabs on the right editing panel containing “Layout”, “Style” and “Advanced”. Go and start with the Layout tab.

1. Layout

Content

Style

Select your preferred layout for Heading Title here. We have provided a ton of them.

Main Title

As the title suggests, a main heading text for block.

Subtitle

A subtext or subtitle for the main title.

Extra Title

Extra title is an option to add and design some extra text along with the main title.

Extra Title position

Where to add extra text, before or after the main title.

Layout

Main Heading

An option to fetch and put the page title as a text for the main title.

Alignment

Alignment of text into left, center or right direction.

Title & Subtitle Limit

Add letter/ word limit for title & subtitle texts.

Limit On

How you want to control the limit, letter wise or word wise.

Count

A numeric input to add a limit on text.

Ending Dots

Show ending dots after the limit reaches for text.

Subtitle Position

Where to add subtitle text, before or after the main title.

2. Style

The Style tab is used for customizing the appearance of all the Heading Title block components. All these styling options include customizing the fonts, colors, background, margins and padding which are common across all the blocks. So, we have created a single detailed article explaining these Styling Options.

View The Style Tab Article

Main Title

Title Tag

An HTML tag for the title.

Typography

Assign a size, weight, spacing and much more to fonts.

Color

A color picker to assign a suitable color to the title text.

Margin

Put in some outer space to an element.

Padding

Put in some inner space to an element.

Border

Draw a border around the element and give width and color to it.

Border Radius

Set the radius curve of the element’s corner.

Background

Apply suitable background like color/ gradient to an element.

Box Shadow

Give Box/Text/Drop shadow effect and color to an element.

Subtitle

Sub Title Tag

An HTML tag for subtitles.

Typography

Assign a size, weight, spacing and much more to fonts.

Color

A color picker to assign a suitable color to the subtitle text.

Margin

Put in some outer space to an element.

Extra Title

Typography

Assign a size, weight, spacing and much more to fonts.

Color

A color picker to assign a suitable color to the extra text.

3. Advanced

Advanced Tab Options are common across all the blocks. So, we have written a detailed tutorial explaining how to use these options.

View The Advanced Tab Tutorial

Was this article helpful?
0 out of 5 stars
5 Stars 0%
4 Stars 0%
3 Stars 0%
2 Stars 0%
1 Stars 0%
How can we improve this article?
Please submit the reason for your vote so that we can improve the article.