The Heading Title widget builds a heading out of up to three pieces of text — a main title, a sub title and a short extra title — and gives you nine ready-made layouts plus GSAP text animation on top.
This page walks through every section of the widget’s panel and says what each setting actually does on the page.
Requirement – This widget is a part of The Plus Addons for Elementor, make sure it’s installed & activated to enjoy all its powers.
Before You Start
- Edition: the Heading Title widget itself is free; only the Animated Split style and its Animated Split Text Options need The Plus Addons for Elementor Pro.
- Widget to enable: Heading Title, under The Plus Addons > Widgets. Search for it and turn the toggle on.
- Prerequisite: Elementor (free) installed and active.
Turn the Widget On
- Go to The Plus Addons > Widgets.
- Search for Heading Title and turn its toggle on.
- Edit a page with Elementor, search the panel for Heading Title and drag it onto the canvas.
Layout
The Layout section decides the shape of the heading before you type anything into it.
Style offers nine layouts. Eight of them differ only in the separator drawn between the title and the sub title; the ninth, Animated Split, is a different thing altogether and needs Pro.
| Style | What it does |
|---|---|
| Modern (default) | Title, sub title and the optional extra title, no separator. |
| Simple | A plain title and sub title. |
| Classic | Adds a single line separator between the title and sub title. |
| Double Border | Adds a double line separator. |
| Vertical Border | Adds a vertical bar above or below the title. |
| Dashing Dots | Uses dots as the separator. |
| Unique | A styled title and sub title pairing. |
| Stylish | Combines a border with dots as the separator. |
| Animated Split (Pro) | Splits the title into words, characters or lines and animates each piece in. Replaces the whole title/sub title layout — see the Animated Headings doc. |
Select Heading chooses where the main title’s text comes from: Default uses whatever you type, Page Title pulls the current page’s title instead. The Page Title doc covers that.
Alignment aligns the whole block, and it has separate tablet and mobile values.
The Import Presets button at the top of the section drops in a ready-made design that you can then edit.
Content
Three text fields, all of which accept Elementor dynamic tags:
- Heading Title — the main line. Default Heading.
- Sub Title — the smaller line. Default Sub Title.
- Extra Title — a short word or badge sitting next to the main title. Default Title. It only exists on the Modern style.
- Extra Title Position — whether the extra title sits after or before the main title. Modern style only.
Heads up: the two Extra Title Position options are labelled the wrong way round in 6.5.0. Choosing Prefix puts the extra title after the main title, and choosing Postfix puts it before. Both were checked on the front end. Pick by the result you see, not by the label.
Extra Option
This section trims long text. Turn on Heading & Sub Title Limit and two popovers appear, Heading Title Limit and Sub Title Limit, each with the same three settings.
| Setting | What it does | Default |
|---|---|---|
| Limit on | Count by Character or by Word. | Character |
| Heading Title Count / Sub Title Count | How many characters or words to keep. | empty |
| Display Dots | Appends an ellipsis to the shortened text. | On |
The word limit doc walks through this step by step.
Title Text Animation and Sub Title Text Animation
Two identical sections, one for the main title and one for the sub title. Turn on Enable Animation and pick an Animation source:
- Basic — the built-in GSAP presets, configured right here.
- Global — a text animation you saved once in Site Settings and reuse. This only appears as a usable dropdown when the Text Global Animation extension is on.
With Basic selected, Animation Type offers Normal, Explode / Scatter, Scramble Text and Typing Effect. The text animation doc covers each one and the settings they share.
Style Tab
The Style tab is grouped by the part of the heading it affects.
| Section | What you can change |
|---|---|
| Main Title | Title Tag (the HTML tag), padding, typography, colour, text shadow and Special Effect. |
| Sub Title | Sub title tag, padding, typography and colour. |
| Extra Title | Typography and colour of the extra title. |
| Advanced | Whether the main title sits above or below the sub title. |
On Scroll View Animation lower down the Style tab is the site-wide extension that animates any widget as it scrolls into view. It is not specific to this widget.
How It Behaves
- The title, sub title and extra title are three separate elements — a limit, an animation or a style applies to one of them, not to the heading as a whole.
- Page Title replaces the main title only. Whatever you typed into Sub Title and Extra Title still renders.
- Text animations are GSAP-driven and split the text into per-character or per-word spans in the page markup.
- Animated Split is a layout, not an add-on: choosing it hides the separator, extra title and limit settings, because it does not use them.
Limitations
- Animated Split needs Pro. With only the free plugin, a heading already saved with that style renders as a plain, static heading — no split, no motion, no error.
- With Animated Split and Type set to Character, the spaces between words are dropped, so “Animated Headings” renders as “AnimatedHeadings”. Use Word or Line if the spacing matters.
- Extra Title and Extra Title Position only exist on the Modern style.
- Display Dots adds one ellipsis character, not three full stops.
Troubleshooting
The widget is not in the Elementor panel
Turn it on at The Plus Addons > Widgets, then reload the editor tab.
I picked Animated Split and nothing animates
Animated Split is a Pro style. Check that The Plus Addons for Elementor Pro is installed and active.
The Extra Title field disappeared
Switch Style back to Modern. No other style has it.
My animation runs in the editor but not on the live page
Open the page itself rather than the editor preview, and clear any page cache. The animation runs once on load unless you turn Repeat on.
