MOVING TEXT ON SCROLL - Elementor Wordpress Tutorial Flex Container

We're harnessing the power of Elementor with this no-code feature. Simple but interesting and hopefully useful!
Timestamps:
00:00 Intro
00:15 Demo
08:05 Outro
Thank you for watching!
🟠 SUBSCRIBE TO THE NEWSLETTER:
newsletter.studioegli.com/
🟠 TRY ELEMENTOR
be.elementor.com/visit/?bta=2...
🟠 TRY HOSTINGER
hostinger.com?REFERRALCODE=1ANDREEA61
🟠 WORK WITH ME
www.studioegli.com/
🟠 YOU CAN FIND ME HERE TOO
TWITTER - @AndreeaEgli
LINKEDIN - / egliandrea
INSTAGRAM - / egliandrea.studios
🟠 FOR BUSINESS ENQUIRIES
[e-mail]
Disclaimer - Some links in my videos' description box may be affiliate links, meaning I will make a commission on purchases you make through my link. This is at no extra cost to you to use my links/codes, it's just one more way to support me and my channel! :)
#elementortutorial #elementorpagebuilder #elementortipsandtricks

[@andreaegli]

How do you see yourself using this feature?

[@elyeslounissi5796]

You are the best

[@smartwebsource371]

Wow! The way you demonstrated moving text on scroll using Elementor is incredibly helpful. Thanks for the fantastic tutorial! 👏💯

[@andreaegli]

You're very welcome!

[@joelroblesmunoz7576]

will never get enough of these videos, loved it!

[@andreaegli]

I sure hope so!!! thank you, Joel!

[@Andresvideo]

Really cool technique, thanks for sharing!!

[@fernandopaiva85]

An interesting story about how I got into your videos. Two weeks ago a client told me that the price I was charging for a website was too high. He said: "Your website doesn't worth this much. Look at these websites!" (he showed me 5 GREAT websites). He continued: "Money is not the problem here, but if I'm going to spend a high amount of money on something, this something must deliver more than the standard. Everyone can do what you do for a lower price".
I realized that I was delivering a mediocre service (websites, design, branding,...you name it). Big clients want great ideas, great deliveries, out of the box thinking. Then I asked myself: "What IS the extraordinary? What is an extraordinary website? What makes a great website...Great?". I discovered that websites that tell a story, have good interactions / animations make their eyes shine (and let's be honest: these are really cool features).
That's how my "pursuit of the extraordinary" lead me to your channel. Every technique that you teach here is GOLD for increasing the website experience. Every video you make is a key to unlock a new opportunity for better websites, betters interactions, self-confidence.
So, I just want to thank you so much for sharing your knowledge, for being so kind and helping others to increase their service level. You are awesome, Andrea. Thank you, thank you!

[@andreaegli]

Oh, Fernado! this was one of the most eye watering messages I've received on here so far.
Thank you very much for your kind words, you have no idea what this means to me!
If there's anything you would like to see on the channel, drop it under the video I have set as a 'trailer'. Let's keep making extraordinary websites!!!!

[@thiagom34546]

your videos are incredible! congratulations for the work

[@andreaegli]

Thank you so much, Thiago!

[@ZHARCO]

Thank you so much

[@Art-01]

Love it, thank u for sharing✌️👍🏻

[@andreaegli]

Awesome! Thank you for watching it 🤓

[@zafit02]

this videos are gold please keep uploading they are different and more pro

[@andreaegli]

Will do, Santiago! thank you so much!

[@franktielemans6624]

Nice tutorial!
The negative margin you applied at 3:43 bothered me though.
This causes the wrapping behavior on tablet and mobile. When the text becomes too big it will wrap again.
I looked into it and I found a CSS solution.
Eventually I thought I could simply solve this with flex-wrap: nowrap on the ul and white-space: nowrap on the li to prevent the words to break.
And indeed, when I tried that in the Chrome devtools it worked like a charm, but it didn't in the Elementor editor.
When I checked the devtools I noticed the CSS was simply ignored possibly due some specificity issues I can't solve.
So I tried it with CSS grid...
Do the same thing, but DON'T add the negative margins.
Instead add this CSS in the iconlists
selector .elementor-widget-container {
overflow: visible;
}
selector ul {
display: grid;
grid-auto-flow:column;
}
selector li {
white-space: nowrap;
}
Now the text will never wrap again and you can make it as big and small as you want.

[@andreaegli]

hey Frank!!! I love all your solutions, thank you for this !!!!!

[@robby_carter]

Nice!

[@thewebstylist]

Very cool! 🎉

[@andreaegli]

Thanks! 😀

[@flameboyxo]

Andrea back with another banger!! 🔥

[@andreaegli]

hehe, you know it, Dawood!

[@jeeiee_com]

Thanks for creating this ❤

[@andreaegli]

You’re welcome ☺️

[@robby_carter]

Amazing as always. Do you have a trick to add scrub to the scrolling?

[@azadvertised]

Pretty cool indeed 👏🏾

[@andreaegli]

Thank you

[@omundoavolta]

nice, that so cool

[@andreaegli]

thank you!

[@user-hd4wm2lu2s]

I like all video Elementor thank you maam because I have learn a lot of video

[@andreaegli]

You are welcome!

[@kasunwitharana2933]

wowww ❤🎉

[@andreaegli]

🤓

[@khadija_sultan]

Amazing videos, please make a video on image scroll parallax effect in elementor, as you have shown color changing effect on scroll, please make it
Thank you for making such videos they are very useful for us🎉

[@kayquebritoo]

Nice girl, thanks very much!

[@beuvrin3591]

Hi Andrea, I'm a fan of your channel, but I have a question about this video. How do I remove the green/red guide that appears on the side of the page? This guide appears to me on the normal web.

[@futuretechtv2008]

You are so sweet..! Love to watch you do the tutorial..☺

[@andreaegli]

Thank you so much!😁

[@AdityaSingh-ni7vn]

can we do similarly for image when we scroll images move

[@andreaegli]

Ha, yes! I have a video coming next week for this effect with images. It has been requested a lot so I said, let’s go it! 😅

[@PPreye]

Love this tutorial. I can’t find scroll effect on my Elementor, is it a pro feature only?

[@andreaegli]

Thank you! Yes, scrolling effects are a pro feature of Elementor I'm afraid.

[@TechSaaz12]

Wow

[@leonlaborina2717]

i dont have the horizontal scroll

[@monarmy20]

Hehe hello how you are doing good
Tip for you to work quick 😉
.
After changing typography r margins etc of one container you can just click on copy and then paste style on the other will make it automatically like first one
No need to do it like this again.
Wonderful videos though
Thank you 😊

[@andreaegli]

Hey! Thank you😉
Yup, I know but I keep forgetting that we have this option now😁

[@shivudesign9210]

Awesome tut bring tuts n framer too

[@andreaegli]

Thank you Shivu! I’m considering it 😉

[@shivudesign9210]

@@andreaegli Yeah! Andrea waiting for it 😉

[@NaveedAhd]

You should do Website review series

[@andreaegli]

I might but I have some other videos in the pipeline for now 😉

[@SerenaKoeber]

I love you. That's all I want to say to you

[@andreaegli]

Awww, thank you, Serena 🥰 why tho? 😁

[@SerenaKoeber]

@@andreaegli Because I've been looking for so many months for another woman to explain it to me and show me how to do this and be nice about it

[@user-hd4wm2lu2s]

full menu with creative popup please make video Elementor

[@andreaegli]

will keep that in mind.In the meantime, you can check this out: ruclips.net/video/2BbgbHEVfA0/видео.html

[@teuccio73]

no comment !!!!

[@andreaegli]

thank you!

[@techywarrior1190]

okeyyy got it but I want to make it infinite loop