Advanced Heading Module Overview #
The Advanced Heading Module gives you complete control over heading design by allowing you to split a heading into Prefix, Infix, and Suffix parts. Each part can be styled independently, and you can enhance your headings with icons, dividers, transparent text effects, and subheadings.
This module is ideal for creating visually rich section titles while remaining fully compatible with the Divi Builder’s native workflow.
Advanced Heading Module Content Settings #
Heading #
These options control the main heading text and structure.
Available options include:
- Heading Prefix
- Heading Infix
- Heading Suffix
- Enable Icon for Heading (On / Off)
- Heading Icon
- Icon Color
- Icon Size
- Icon Placement (Left / Right)
- Gap Between Title and Icon
Sub Heading #
Add an optional subheading below the main heading.
Available options include:
- Enable Sub Heading (On / Off)
- Sub Heading Text
Divider #
Add a divider line to visually separate heading elements.
Available options include:
- Enable Divider (On / Off)
- Divider Position (Top, Middle, Bottom)
- Divider Height
- Divider Width
Transparent Heading #
Create a large background-style heading behind the main text.
Available options include:
- Enable Transparent Heading (On / Off)
- Transparent Heading Text
- X Offset
- Y Offset
- Rotate
- Rotate Origin
(Top Left, Top Center, Top Right, Center Left, Center, Center Right, Bottom Left, Bottom Center, Bottom Right)
Background #
Set a background for the heading container.
Admin Label #
Assign an admin label to easily identify the module in the Divi Builder.
Advanced Heading Module Design Settings #
Text #
General text alignment and shadow options.
Available options include:
- Text Alignment
- Text Shadow
Heading #
Control the appearance of the main heading text.
Available options include:
- Heading Background
- Heading Level (H1–H6)
- Font
- Font Weight
- Font Style
- Text Alignment
- Text Color
- Text Size
- Letter Spacing
- Line Height
- Text Shadow
- Rounded Corners
- Border Styles
- Border Width
- Border Color
- Border Style
- Box Shadow
Heading Prefix #
Style the prefix text independently.
Available options include:
- Prefix Display Type
- Prefix Background
- Enable Text Clip (Yes / No)
- Enable Background Clip (Yes / No)
- Fill Color
- Stroke Color
- Stroke Width
- Font
- Font Weight
- Font Style
- Text Alignment
- Text Color
- Text Size
- Letter Spacing
- Line Height
- Text Shadow
Heading Infix #
Style the infix (main emphasis text) independently.
Available options include:
- Infix Display Type
- Infix Background
- Enable Text Clip (Yes / No)
- Enable Background Clip (Yes / No)
- Fill Color
- Stroke Color
- Stroke Width
- Font
- Font Weight
- Font Style
- Text Alignment
- Text Color
- Text Size
- Letter Spacing
- Line Height
- Text Shadow
Heading Suffix #
Style the suffix text independently.
Available options include:
- Suffix Display Type
- Suffix Background
- Enable Background Color
- Enable Text Clip (Yes / No)
- Font
- Font Weight
- Font Style
- Text Alignment
- Text Color
- Text Size
- Letter Spacing
- Line Height
- Text Shadow
Sub Heading Design #
Control the appearance of the subheading text.
Available options include:
- Sub Heading Background
- Enable Background Color
- Heading Level
- Font
- Font Weight
- Font Style
- Text Alignment
- Text Color
- Text Size
- Letter Spacing
- Line Height
- Text Shadow
- Rounded Corners
- Border Styles
- Border Width
- Border Color
- Border Style
- Box Shadow
Divider Design #
Control the appearance of the divider.
Available options include:
- Divider Background
Transparent Heading Design #
Control the styling of the transparent heading.
Available options include:
- Opacity
- Stroke Color
- Stroke Width
- Heading Level
- Font
- Font Weight
- Font Style
- Text Color
- Text Size
- Letter Spacing
- Line Height
- Text Shadow
- Rounded Corners
- Border Styles
- Border Width
- Border Color
- Border Style
- Box Shadow
Spacing #
Control spacing between heading elements.
Available options include:
- Heading Margin
- Heading Padding
- Sub Heading Margin
- Sub Heading Padding
- Divider Margin
- Divider Padding
Sizing #
Control the overall size and alignment of the module.
Available options include:
- Width
- Max Width
- Module Alignment
- Min Height
- Height
- Max Height
Filters #
Apply visual filters to the module.
Available options include:
- Hue
- Saturation
- Brightness
- Contrast
- Invert
- Sepia
- Opacity
- Blur
- Blend Mode
Advanced Heading Module Advanced Settings #
CSS ID & Classes #
Assign custom CSS IDs or classes for styling or JavaScript targeting.
Custom CSS #
Apply custom CSS to specific elements within the module using the available fields.
Attributes #
Define HTML attributes for the module.
(Used mainly for accessibility or advanced integrations.)
Conditions #
Control when the module is displayed based on conditions such as:
- Time and date
- User behavior
- Browser or operating system
- Purchase history
Multiple conditions can be combined.
Visibility #
Control module visibility across devices and overflow behavior.
Available options include:
- Hide on Phone, Tablet, or Desktop
- Overflow behavior (Visible, Hidden, Scroll, Auto)
Transitions #
Control hover transition timing.
Available options include:
- Transition Duration
- Transition Delay
- Speed Curve
Position #
Control how the module is positioned on the page.
Available options include:
- Position Type (Default, Relative, Absolute, Fixed)
- Vertical and Horizontal Offset
- Offset Origin
- Z-Index
Scroll Effects #
Define scroll-based behaviors.
Available options include:
- Sticky Position (Top, Bottom, or Both)
- Scroll Transform Effects
- Vertical Motion
- Motion Trigger Point
(Top, Middle, or Bottom)
Summary #
The Advanced Heading Module allows you to build visually striking headings with layered text, icons, dividers, and transparent effects—all while maintaining full control over typography, spacing, and animation within the Divi Builder.
