The Text Animation Extension allows you to create engaging text animations directly within Divi. Animate individual characters, words, or entire text blocks using a variety of animation effects and trigger options.
Whether you're building animated headlines, hero sections, call-to-action content, or interactive landing pages, Text Animation gives you complete control over how your text appears and behaves.
Requirements #
Before using the Text Animation Extension, make sure you have:
- Divi Theme or Divi Builder installed and activated
- DiviAnimator installed and activated
- Text Animation Extension enabled
How to Enable Text Animation #
- Log in to your WordPress Dashboard.
- Navigate to DiviAnimator → Extensions.
- Locate Text Animation.
- Enable the extension.
- Save your changes.
Once enabled, Text Animation settings will become available inside supported Divi modules.
Available Animation Effects #
The Text Animation Extension includes the following animation effects:
- Character
- Word
- Text Move
- Text Reveal
- Text Scale
- Text Invert
- 3D Spin
Select the animation effect that best fits your design.
Enable On Editor #
The Enable On Editor option allows you to preview animations directly inside the Divi Builder.
Enabled #
Animations will play inside the builder, allowing you to preview changes in real time.
Disabled #
Animations will only play on the frontend of your website.
Character Animation #
The Character effect animates each character individually, creating attention-grabbing text animations.
Trigger #
Choose when the animation should start:
- On Scroll
- On Page Load
- Play With Scroll
- On Hover
- On Click
Text Wrapper #
Select how the text should be wrapped before animation.
- Default
- Custom
Delay #
Controls how long the animation waits before starting.
Duration #
Controls how long the animation takes to complete.
Stagger #
Adds a delay between each animated character.
Transform X #
Controls the horizontal starting position of the text.
Transform Y #
Controls the vertical starting position of the text.
Breakpoint #
Choose where the animation should be active:
- All
- Laptop
- Tablet Landscape
- Tablet Portrait
- Mobile Landscape
- Mobile Portrait
Word Animation #
The Word effect animates each word individually instead of each character.
All settings available in Character Animation are also available for Word Animation:
- Trigger
- Text Wrapper
- Delay
- Duration
- Stagger
- Transform X
- Transform Y
- Breakpoint
This effect is useful for creating smooth text reveals and storytelling experiences.
Text Move #
The Text Move effect adds directional movement and rotation to your text.
Trigger #
- On Scroll
- On Page Load
- Play With Scroll
- On Hover
- On Click
Text Wrapper #
- Default
- Custom
Delay #
Controls when the animation begins.
Duration #
Controls how long the animation plays.
Stagger #
Adds spacing between each animated element.
Rotation Direction #
Choose the rotation axis:
- X Axis
- Y Axis
Rotation Value #
Controls how much the text rotates during the animation.
Transform Origin #
Defines the starting point of the rotation.
Examples:
- Top Center
- Bottom Right
- Center Left
- Center Center
- Custom Values
Breakpoint #
Choose where the animation should be active.
Text Reveal #
The Text Reveal effect reveals text progressively using smooth entrance animations.
Available Settings #
- Trigger
- Text Wrapper
- Delay
- Duration
- Stagger
- Breakpoint
This effect is ideal for headings, hero sections, and content reveals.
Text Scale #
The Text Scale effect animates the size of your text.
Trigger #
- On Scroll
- On Page Load
- Play With Scroll
- On Hover
- On Click
Text Wrapper #
- Default
- Custom
Delay #
Controls when the animation starts.
Duration #
Controls animation speed.
Stagger #
Creates a sequential scaling effect.
Scale #
Defines the final scale size of the animated text.
Ease #
Choose the animation easing style:
- Power2 Out
- Bounce
- Back
- Elastic
- SlowMo
- Stepped
- Sine
- Expo
Text Break By #
Choose how the text should be split:
- Lines
- Words
- Characters
Breakpoint #
Control where the animation is active.
Text Invert #
The Text Invert effect reverses the text and background colors inside the animated area.
For example:
- Black text becomes white.
- White text becomes black.
This effect creates unique visual interactions and works particularly well for modern designs.
Available Settings #
- Trigger
- Text Wrapper
- Breakpoint
3D Spin #
The 3D Spin effect creates a rotating 3D text animation.
Trigger #
- On Scroll
- On Page Load
- Play With Scroll
- On Hover
- On Click
Text Wrapper #
- Default
- Custom
Delay #
Controls when the animation begins.
Spin Text Color #
Choose the color used during the spin effect.
Options include:
- Primary
- Secondary
- Text
- Accent
Start #
Defines when the animation should begin.
Example:
- Top 50%
End #
Defines when the animation should finish.
Example:
- Bottom 30%
Toggle Actions #
Control animation behavior when entering or leaving the viewport.
Examples:
- Play None None Reverse
- Play Reverse Play Reverse
- Restart None None None
- Play Reset Play Reset
Breakpoint #
Control where the animation should be active.
Need Help? #
If you need assistance using the Text Animation Extension, please contact the DiviExpand support team via “support@diviexpand.com”. We're always happy to help.
