Are you looking to add a marquee text effect in Elementor? Marquee text, also known as scrolling or ticker text, is a moving text that grabs the attention of visitors and adds a sense of motion to a webpage. This eye-catching effect can be used to highlight important information.
With the Advanced Typography widget from The Plus Addons for Elementor, you can easily create a marquee text in Elementor.
To check the complete feature overview documentation of The Plus Addons for Elementor Advanced Typography widget, click here.
Requirement – This widget is a part of The Plus Addons for Elementor, make sure its installed & activated to enjoy all its powers.
To do this, add the Advanced Typography widget to the page and follow the steps –
1. In the Advanced Typography tab, select Normal or Multiple from the Select Option dropdown.
Let’s select Normal.
2. Then add the text in the Text field.
3. After that enable the Enable/Disable toggle from the Marquee tab.
Note: In the Multiple option you’ll find the Marquee option in each text repeater item.
Then from the Type dropdown, you can select the marquee type. Here you’ll find two options –
- Default – This will add a marquee tag to create the marquee effect.
- On Transition – This will create the marquee effect using CSS transition.
Note: We recommend using the On Transition option as the marquee tag is not very SEO friendly.
Let’s select Default here.
From the Direction dropdown, you can select the marquee scrolling direction. From here you can set the marquee direction to left, right, top and bottom.
Then from the Behavior dropdown, you can set the scrolling behavior. Here you’ll find three options –
- Scroll – This will add a scrolling effect.
- Slide – This will create a sliding effect.
- Alternate – This will make the text move in both directions alternatively.
In the Loop field, you can set how many times the animation will play.
Note: You can set the loop to 0 or -1 to set an infinite loop.
From the Speed field, you set the animation speed.
Then from the Animation Duration field, you can set the animation duration.
You can set the marquee animation horizontal area for responsive devices in the Width field.
Based on your settings you’ll see a beautiful marquee text.
Suggested Reading: How to Create Elementor Background Text Blend Mode?
