Elementor Animated Text Widget Tutorial

Intro

Elementor Animated Text Widget by Premium Addons allows you to add vibrant text to your WordPress site. This widget offers two text styles, Switched and Highlighted, each with various customization options. Sweeten your site’s typography with this easy-to-use tool.

Check Elementor Animated Text Widget demo.

Requirements:

• You will need Premium Addons free plugin installed and activated on your website.
• Ensure the feature is enabled to find it in the Elementor editor.
• Premium Addons Pro is required for:
  • Animated Text Pro features:
    • Switch
      • Effect: Clip (Pro), all the others are free
    •  Highlight
      • Effects include Animated Shadow, Animated Pattern, Animated Fill, and Tilt (Free); all other effects require a Pro subscription.
• Premium Addons works only with Elementor Page Builder plugin so you will need to have it installed and activated.

Key Features

• General
• Additional Settings

General

• Text Style: Select “Switched”.
• Before Text: Input field to add text that appears before the animated part.
• Fancy Text: Multiple entries for animated text.
  • Add Item Button: Adds a new animated text item.
  • Clone Button: Duplicates the existing text item.
  • Delete Button: Removes the text item.
• After Text: Input field to add text that appears after the animated part.

• Text Style: Select “Highlighted”.
• Before Text: Input field to add text that appears before the highlighted part.
• Highlighted Text: Input field for the highlighted text.
• After Text: Input field to add text that appears after the highlighted part.

• Link: Add a URL link to the animated text.
• Display: Choose between Inline or Block display.
• Alignment: Align the text left, center, or right.
• HTML Tag: Set the HTML tag for the animated text (e.g., H1, H2, H3).

Additional Settings

Switched Text Type

Please note that Clip animatated effect in the Switched Text Type requires Premium Addons PRO installed and activated on your website.

• Effect: Select the effect type.
• Type Speed: Set typing effect speed in milliseconds.
• Back Speed: Set backspace effect speed in milliseconds.
• Start Delay: Set delay before starting the animation in milliseconds.
• Back Delay: Set delay before starting the backspace effect in milliseconds.
• Loop: Toggle to enable or disable the looping of the animation.
• Show Cursor: Toggle to show or hide the cursor.
• Cursor Mark: Input field to specify the cursor mark.

Highlighted Text Type

Please note that all animatated effect in the Highlighted Text Type require Premium Addons PRO installed and activated on your website except Animated Shadow, Animated Pattern, Animated Fill, and Tilt are for free version.

• Effect: Select the animation effect.
• Pause on Hover: Toggle to pause animation on hover.

---

Style

Switched Animated Text

• Headline Typography: Customize the typography for the animated text.
• Color: Choose the text color.
• Background Color: Set the background color.
• Stroke Width: Adjust the stroke width for the text.
• Stroke Color: Select the stroke color.
• Margin: Set the margin around the animated text.

Highlighted Animated Text

• Headline Typography: Customize the typography for the animated text.
• Color: Choose the text color.First Color: Set the first color for the text animation.
• Second Color: Set the second color for the text animation.
• Third Color: Set the third color for the text animation.
• Fourth Color: Set the fourth color for the text animation.
• Background Color: Set the background color.
• Stroke Width: Adjust the stroke width for the text.
• Stroke Color: Select the stroke color.
• Animation Speed (sec): Adjust the speed of the animation.
• Margin: Set the margin around the animated text.

Cursor Text

• Color: Set the color for the cursor text for Switched Animated Text.
• Typography: Customize the typography.
• Background Color: Choose the background color for the cursor text.

Before & After Text Style Settings

• Before Text Color: Choose the color for the text that appears before the animated text.
• After Text Color: Choose the color for the text that appears after the animated text.

---

Conclusion

Elementor Animated Text Widget by Premium Addons offers extensive customization options for creating dynamic, animated text on your website. Whether you choose the Switched or Highlighted text style, you have full control over the text appearance and animation effects, allowing you to enhance your site’s design with engaging typography.

---

If you still need any further assistance, feel free to contact Premium Addons support team. We would be more than glad to help 😁

Join the Community

You’re most welcome to join our Facebook group and YouTube channel to get updates about new features, improvements, and bug fixes.