GutenKit Fancy Animated Text block takes static text and transform it with eye-catching animations, creating a dynamic and engaging user experience.
Let’s learn how the block works.
GutenKit Fancy Animated Text #
Go to GutenKit from your dashboard -> Go to blocks -> Find Fancy Animated Text -> Turn it ON
![](https://wpmet.com/wp-content/uploads/2024/06/Turn-ON-fancy-animated.png)
Search the block #
Open any page/post where you want to add fancy texts.
Search GutenKit Fancy Animated Text, drag or click the block and add it to the editorial.
![](https://wpmet.com/wp-content/uploads/2024/06/Drag-fancy-animated.png)
The block looks like this. You can also use a GutenKit Fancy animated text template from the library.
![](https://wpmet.com/wp-content/uploads/2024/07/Fancy-animated-block.png)
Customizing the Content Part #
In the content part, you’ll edit the Fancy Animated Text section.
Animation Style (Text) #
If you choose Text style, you’ll get to adjust –
- Select Style: Select Slide Up or Color Effect, see the differences below 👇
![Fancy animated text style](https://wpmet.com/wp-content/uploads/2024/07/Fancy-animated-text-style.gif)
- Animation Delay (Ms): This is the number of milliseconds to wait before the animation starts. You can change is according to your preferences.
- Prefix Text: Here, you can change the prefix word. In the image, the word is ‘Bring’.
- Text before fancy text: You can add, edit and remove the text before the fancy text.
![](https://wpmet.com/wp-content/uploads/2024/06/Fancy-Text-Style-2.png)
Animation Style (SVG) #
If you choose SVG style, you’ll get to adjust –
- SVG Type: Here the types are Clouds, Curly, Zigzag, Shape X, Waves, etc.
- Animation Delay (S): Set how long to wait before the animation starts (in seconds).
- Animation Duration (S): You can control the length of time the animation takes to complete one cycle in seconds.
- Loop: Choose if the animation repeats continuously.
- Prefix Text: Here, you can change the prefix word. In the image, the word is ‘Bring’.
- Highlighted Text: Make specific text focused within the animation.
![Fancy animation style SVG type](https://wpmet.com/wp-content/uploads/2024/07/Fancy-SVG-style.png)
This part is common for each Text and SVG type –
- Suffix Text: This is the texts after the main content in the block.
- Title Html Tag: Here, you can choose the HTML tag for the main title.
- Link: Set a clickable URL if needed.
![](https://wpmet.com/wp-content/uploads/2024/06/Fancy-animated-content.png)
Editing Style #
- Heading Text: It lets you change Alignment, Typography, Color, Hover Color, and Text Shadow.
- Fancy Text Lists: Here you can adjust Typography, Color, Background Type, Padding, etc. for the important text.
![](https://wpmet.com/wp-content/uploads/2024/07/Fancy-Style.png)
Final Output #
This is a customized example 👇
![](https://wpmet.com/wp-content/uploads/2024/06/Fancy-animated-text.gif)