The Animated Split Text widget brings your text to life by splitting it into characters with eye-catching animations. It’s a perfect tool to make headlines stand out and grab attention instantly. Whether you’re designing a hero section or emphasizing key messages, this widget offers smooth control over animation styles and timing for maximum impact.
Let’s look at each of the options in the Animated Split Text widget for Elementor below.
Add Animated Split Text Widget to Elementor
This widget requires Unlimited Elements Pro version installed and activated on your WordPress website.
- Go to Unlimited Elements Widget Library
- Search in the search bar for “Animated Split Text”
- Hover over the widget in the search results and click install
- Add the “Animated Split Text” widget to any Elementor Page
General Settings
Tag
Select the HTML tag to wrap each item.
- div
- p
- span
- a
- H1
- H2
- H3
- H4
- H5
- H6
Animation Speed
Set the duration of the animation in milliseconds.
Animation Delay
Set the delay before animation starts, in milliseconds.
Item Gap
Define the spacing between items.
Item Word Gap
Define the spacing between words inside each item.
Layout
Set the direction of layout:
- Row – Items are aligned horizontally.
- Column – Items are aligned vertically.
Text Align
Set the alignment of text within each item:
- Start
- Center
- End
Widget Align
Align the widget within its container.
Animation
Choose an animation effect for the item.
Slide In – Animate the element by sliding it into view from a direction.
Flip In – Animate the element with a flipping motion, giving a 3D appearance.
Slide In Blurred Top – Slide the element in from the top with a blur effect for added emphasis.
Puff – Create a puff-in effect where the element appears by expanding and fading in.
Tilt – Animate the element with a tilting motion for a dynamic entry.
Scale – Animate the element by scaling it up from a smaller size.
Reveal Each Time on Scroll
Enable to trigger the animation every time the element scrolls into view.
Items Settings
Manage the items of animated split text using the repeater field.
- Add new items
- Duplicate items
- Delete items
- Reorder Items
- Edit Items
Title
Define the title of the item.
Override Color
It allows you to apply a custom color to the item.
Override Size
It lets you define a custom size for the item.
Animated Split Text Widget Styling
You can set the color, typography, text shadow, padding, stroke width and color.
Animated Split Text Design Examples For Elementor
Here are the live use cases for the Animated Split text Widget.
Animated split text with woo product.
Animated split text with content card.
We hope this guide helped you explore the powerful features of the Animated Split Text widget. With its advanced split animations and fine-tuned controls, you can highlight your message with flair and creativity. If you have any questions or need further assistance, feel free to reach out.
