The Divi text rotator module allows you to take any text and rotate it with different phrases so you can create attractive headlines for your Divi site. Choose from any 36 animations to make your message pop.# Content Options
Here you can add as many texts as you want that will have the Rotating Animation effect. You can click on the + Add New Item button to add new text that will get the Rotating effect.
Before Rotator Text
Here you can add some text that will be shown before the Rotator Text and it will not have any Animation effect.
After Rotator Text
Same goes for this, the text you’ll add here will be shown after the Rotator text and will not get any animation.
This is where you can change the animation effect of the Rotator Text. You get over 36 Animations to choose from.
Here you can specify the Speed of the Animation of the Rotating text.
Pause on Hover
When you’ll enable this option It will pause the Rotating animation on hover/mouseover.
Change on Click
You can enable this switch to let users change the Word when they click on the Rotating text.
Heading HTML Tag
Here you can change the Heading HTML Tag of the Rotator text and Before/After Text.
You can play around with the text Design settings here. The changes you’ll make here will be applied to all the texts i.e Rotator Text and Before/After Text.
Before, Rotator and After Text
You can easily style the Before, Rotator and After text in the same way you style text in the Text Module(came with Divi Builder). And we’ll only discuss those options which are added by Text Rotator Module to style the text’s background, padding and stuff.
Background Color: Here you can add color to the Background of the Before, Rotator and After text.
Margin and Spacing: Add some Margin and Spacing to the Before, Rotator and After text, if you want to add some spacing on both sides of Before, Rotator and After Text.
Display: You can change the display property of the text to Inline Block and Block.
- Inline Block displays the text in the same line as other texts.
- Block Displays the text by making it a block means other texts will not be displayed in the same line.
And you can play around with Before, Rotator and After text by adding different colors, text-shadows, border, border-radius and more to each text.
Rotator Text Module Advanced Options
Use the advanced options to give your Rotator Text custom CSS ID’s and Classes. Add some custom CSS for advanced styling and designate the module’s visibility on certain devices.