HORIZONTAL / VERTICAL SCROLL WITH MOTION.PAGE - Elementor Wordpress Tutorial Flex Container

แชร์
ฝัง
  • เผยแพร่เมื่อ 2 ม.ค. 2025

ความคิดเห็น • 89

  • @andreaegli
    @andreaegli  11 หลายเดือนก่อน +12

    Let me know if you enjoyed it. Please don't ask when I will make one with GSAP, it's coming...soon...

    • @xAndre-SDM
      @xAndre-SDM 11 หลายเดือนก่อน +1

      I has the motion.page activated. I'm going to follow your tutorial. 🥳🎉
      Waiting here. 👍🏼

    • @Webrisernl
      @Webrisernl 11 หลายเดือนก่อน +1

      Lookss so cool... how does it work on mobile? Can we use this for client work?

    • @andreaegli
      @andreaegli  11 หลายเดือนก่อน

      @@Webrisernl it is cool! I forgot to show that in the video but you can adjust the animation from the top bar in motion.page

    • @Webrisernl
      @Webrisernl 11 หลายเดือนก่อน

      @@andreaegli would be great if you can show that in a video!

    • @rexyyoyo4878
      @rexyyoyo4878 11 หลายเดือนก่อน

      Thank you! mwah mwah mwah

  • @NataniaCory
    @NataniaCory 11 หลายเดือนก่อน +2

    I’ve been searching for this! Thank you for always providing solutions for us ❤

    • @andreaegli
      @andreaegli  11 หลายเดือนก่อน

      My pleasure 😊

  • @YusufErenIslim
    @YusufErenIslim 11 หลายเดือนก่อน +1

    perfect video, thanks Andera💜

    • @andreaegli
      @andreaegli  10 หลายเดือนก่อน

      You are very welcome 🙏

  • @slobodanzdravkov
    @slobodanzdravkov 11 หลายเดือนก่อน +1

    first i hit like and then watch the video! keep recording cool stuff!

    • @andreaegli
      @andreaegli  11 หลายเดือนก่อน

      hahaha, awesome! Love that, thank you so much!

  • @KEVIN-p3l8v
    @KEVIN-p3l8v 10 หลายเดือนก่อน +4

    i like the idea you r smart , but you used the motion page with the difficult way 😊 don't hate me please🥰😁, u don't need to change to selector but just add 0% for start trigger and -100% for the end , you will only write the ID of the pin element and the ID of the animation element , and use CSS ID it is more accurate than the CLASS ID for the single animation but you will need to add # instead of the DOT , and turn off the scroll smoother it is not work right with elementor but it is work perfect in other builders,
    i been using motion page for long time it is amazing i latterly using it in everything , once u get used to it u will do everything in like 5 minutes

  • @sergiosanchez3618
    @sergiosanchez3618 23 วันที่ผ่านมา

    Great video! Would it be possible to achieve this effect if the inner sections are not full height?

  • @franktielemans6624
    @franktielemans6624 11 หลายเดือนก่อน +4

    Plenty motion page tutorials here. Almost daily.
    www.youtube.com/@kokorowebanimation/videos
    For bricks but that shouldn't be a problem, just create the same structure and add the same classes in Elementor and you're good to go.

    • @andreaegli
      @andreaegli  11 หลายเดือนก่อน +5

      Thanks for this & while that's great, the point I was trying to make was that the makers of @motionpage do not care much about making tutorials. Since they offer the plugin for Elementor too why are there no tutorials for Elementor on THEIR channel. Let's not assume everyone is like you and me, Frank. It needs to be inclusive. This is not how you market a new plugin or product for that matter. Trust me, their plugin would sell much more and their churn wouldn't be that high if they took care of building their community the right way. The way they are doing it feels very old-school for a modern plugin.

    • @mariopereira6018
      @mariopereira6018 11 หลายเดือนก่อน

      @@andreaegli That’s right Andrea 😋 Do you remember that I told you about that channel? But I have been looking for tutorials of @motion.page for Elementor and I didn’t find anything. And when you said that you will be start this year to do tutorials for Elementor, I was very happy! 😍
      Thank you for doing it 🤩

    • @RADOS_A51
      @RADOS_A51 10 หลายเดือนก่อน +1

      ​@@andreaegli It is because we are a team of 5 people. Only two of us are native english speakers and one of them is Luke, which makes video on our channel. None of us use (or used in the past) Elementor, so that is why we have tutorials for Oxygen and Bricks as those are the tools we know how to use. We would love to have video for each builder, but this is nearly impossible for us.

    • @andreaegli
      @andreaegli  10 หลายเดือนก่อน +3

      @@RADOS_A51 I get it BUT:
      I actually got in touch with you asking for a license to make videos. I was told to basically get my own. I mean, why would you do that when someone really wants to promote your product? For free nontheless? For a builder that it's actually hardly covered but used by milions of people unlike Bricks for example.
      I'm not a marketing wiz but the math is not mathing. I really, sincerely wanted to help because I believe in your product. If you look at the videos on my channel, I never promote other plugins so that says something. Have 'TH-camrs' help you with this, you don't have to do this alone.

  • @flameboyxo
    @flameboyxo 11 หลายเดือนก่อน +1

    LESGOOOO ANDREA !!! 🔥🔥🔥

    • @andreaegli
      @andreaegli  11 หลายเดือนก่อน +1

      hey!!! where have you been? 🔥

    • @flameboyxo
      @flameboyxo 11 หลายเดือนก่อน

      @@andreaegli work hard !! play hard !! grinding 24/7 💪💪💪 more power to you sir !!

  • @3pm479
    @3pm479 11 หลายเดือนก่อน +2

    omg shes gorgeous teacher

  • @renzference
    @renzference 11 หลายเดือนก่อน +3

    More Motion Page tutorial please! 🙏

    • @andreaegli
      @andreaegli  11 หลายเดือนก่อน +3

      more coming soon

  • @CharlyDS
    @CharlyDS 7 หลายเดือนก่อน +1

    Excellent material. Is it possible to achieve the same results with old Elementor Sections instead of Containers? I have a site with that style and I can't convert it now. Thanks!

    • @andreaegli
      @andreaegli  7 หลายเดือนก่อน +1

      Thank you! I'll be honest, no idea. It could work but the steps might be different than shown in the video..give it a go and let us know

    • @CharlyDS
      @CharlyDS 7 หลายเดือนก่อน

      @@andreaegli yeah it's quite a headache :) lots of nested divs, and css should be used to "flexize" the sections, inner sections and such. Almost got it except for the 5th slide that goes up only after the horizontal ones pass through an empty area (meaning the slides don't fill the width). Some flex/responsive css might be needed. All in all, it might be more sensible to move all to Containers. Thanks again!

  • @yoon_b
    @yoon_b 11 หลายเดือนก่อน +1

    cool stuffs..... i have the same glasses like you by the way.😉😉

    • @andreaegli
      @andreaegli  11 หลายเดือนก่อน +1

      thank you!!! hehe, they are very chic, right?

    • @yoon_b
      @yoon_b 11 หลายเดือนก่อน

      @@andreaegli You're welcome! Absolutely, they are incredibly chic! The stylish and sophisticated vibe they exude is simply fantastic.

  • @morfalm1584
    @morfalm1584 9 หลายเดือนก่อน +1

    Hello, why copy+paste+delete a section ? You can drag&drop it to move it...

    • @andreaegli
      @andreaegli  9 หลายเดือนก่อน

      There’s more than one way of doing things, do whatever fits you best

  • @mariopereira6018
    @mariopereira6018 11 หลายเดือนก่อน +2

    Hello Andrea !
    Thank you so much for this tutorial 🎉
    I waited for it 😅
    Can you send me the template of the final result? So I can import it on Elementor 🙏🏻
    Thank you for teaching us 😊
    I follow all your videos!

    • @andreaegli
      @andreaegli  11 หลายเดือนก่อน +1

      email me

    • @mariopereira6018
      @mariopereira6018 11 หลายเดือนก่อน

      Done ! @@andreaegli I'll be awaiting for your answer.
      Thank you!

  • @carolina_flores
    @carolina_flores 8 หลายเดือนก่อน

    Amazing help!!! Thank you

  • @digitalnomads2673
    @digitalnomads2673 10 หลายเดือนก่อน +1

    Hi trere. Thanks for your videos! What about HORIZONTAL / VERTICAL SCROLL with code (Elemnetor Pro)? Waiting for it!

    • @andreaegli
      @andreaegli  10 หลายเดือนก่อน

      You are very welcome! Coming soon!

  • @Webrisernl
    @Webrisernl 10 หลายเดือนก่อน +1

    I just try to Keep use Less as possible plug-ins... some of your gsap tutorials just only need elementor pro right?

    • @andreaegli
      @andreaegli  10 หลายเดือนก่อน

      same here ;) yes

  • @pabloguillermoalarcon1665
    @pabloguillermoalarcon1665 3 หลายเดือนก่อน

    Thank You

  • @Webrisernl
    @Webrisernl 10 หลายเดือนก่อน

    Can you please share how to get Container layout option in elementor?

  • @visionstudio-co
    @visionstudio-co 10 หลายเดือนก่อน +1

    For everyone thinking the same i thought do exactly the same as Andrea does but dont give flex-grow & flex-shrink 0. Instead let your boxes be next to each other and in motion page give from 100 to 0 an so you boxes will slide from the right side untill they nicely set to full preview hoho

  • @henriquesilva8533
    @henriquesilva8533 11 หลายเดือนก่อน +1

    So I can only do this effect using this paid plugin?

    • @andreaegli
      @andreaegli  11 หลายเดือนก่อน

      For now, yes!

  • @skillswithzain
    @skillswithzain 9 หลายเดือนก่อน +1

    I don't know why it looks like that I'm watching Living With Pixels in female version😄 BTW.. Great Work👌

    • @andreaegli
      @andreaegli  9 หลายเดือนก่อน

      Maybe I should meetup with Rino at some point 😅 you’re not the first to point out the similarities 🤣

  • @mariano-cucinotta
    @mariano-cucinotta 10 หลายเดือนก่อน +1

    Hi, sorry to bother you, I have a hard time following your tutorial because I don't know English language. I entered the translation but follow what you do on the screen and the translation I can't. I would like to ask you if there is a possibility to get the .json file of the project, even paying for it. Thank you

    • @andreaegli
      @andreaegli  10 หลายเดือนก่อน +1

      Hello Mariano! Please provide me with your email address and I will send you the json file. Keep in mind that the effect is not mobile optimized so that's something that you have to do ;)

  • @izhaarmianbscs-1402
    @izhaarmianbscs-1402 6 หลายเดือนก่อน +1

    Nice🙃

    • @andreaegli
      @andreaegli  6 หลายเดือนก่อน +1

      Thanks 😅

  • @Webrisernl
    @Webrisernl 10 หลายเดือนก่อน +1

    is motion page a free pluging? How do I get it?

    • @andreaegli
      @andreaegli  10 หลายเดือนก่อน

      Hey! Nope, it’s not free unfortunately

    • @Webrisernl
      @Webrisernl 10 หลายเดือนก่อน +1

      @@andreaegli okay can I buy it and use it for multiple client projects or do I need to buy it for every project separatly?

    • @andreaegli
      @andreaegli  10 หลายเดือนก่อน +1

      @@Webrisernl go to motion.page and have a look at their pricing to see what best suits your budget. You can get the cheapest license and use it on 5 client websites

    • @Webrisernl
      @Webrisernl 10 หลายเดือนก่อน +1

      @@andreaegli thanks for sharing I have a look.. are there more paid seevices next to elementor pro I should be note of that you are using for your tutorials?

    • @andreaegli
      @andreaegli  10 หลายเดือนก่อน

      @@Webrisernl No, I never use any other paid plugins

  • @SmrutiranjanPrusty
    @SmrutiranjanPrusty 11 หลายเดือนก่อน

    Hello.....motion.page pulgin...Necessary ?...Scrool contener.....direction...horigental....section dorsnot change

    • @andreaegli
      @andreaegli  11 หลายเดือนก่อน

      Follow the steps and it will

    • @SmrutiranjanPrusty
      @SmrutiranjanPrusty 11 หลายเดือนก่อน

      Ok sucessful Complty this animation....ok...thanks.....you egli mam😊

  • @Thegoodvibes-xd9yy
    @Thegoodvibes-xd9yy 11 หลายเดือนก่อน

    hii andrea, good evening. I am from India and I have a request, please make a video on bento design trend and coz its trending and new, and one more video on creating custom shapes of containers in bento

  • @DDesigner123
    @DDesigner123 5 หลายเดือนก่อน +1

    more motion.page tutorials

    • @andreaegli
      @andreaegli  5 หลายเดือนก่อน

      i'm afraid I won't be doing any motion.page tutorials anymore. I won't get into details but i just don't want to promote a company that has complete disregard for creators

  • @ΜάνθοςΜανωλτζάς
    @ΜάνθοςΜανωλτζάς 11 หลายเดือนก่อน +3

    I think gsap videos are better.In general is better to know gsap instead of a plug-in.

    • @andreaegli
      @andreaegli  11 หลายเดือนก่อน +3

      I agree but there are clients who don't want to mess around with code, who might want to change things themselves. This plugin might be it for them. I definitely don't want to depend on a plugin hence why I'm making gsap videos but you know, there are others who need this too 😉 For example, I can't for the life of me make this effect with code. I'm getting closer to a solution tho and when I have it working, I'll post it.

  • @glencoe1266
    @glencoe1266 11 หลายเดือนก่อน +1

    I dont want to fork out money again like I did last year for motion page. It was a mess with lots of bugs and things not working as they should. And their support was nonexistent..I remember the community was full of people with issues and they stopped replying, like they had given up. I also couldn't find enough tutorials and didn't want to spend hours figuring out how to do things that I expected to work out of the box. Luckily they offered a full refund in no time.
    I don't think I want to go through that again, but it is tempting because building gsap animations and interactions takes your pages to the next level and so very attractive to sell to clients who want that edge. But GSAP unless you are a gifted designer+coder is pretty annoying to master with elementor. There isn't a middle ground with any of this.

    • @andreaegli
      @andreaegli  11 หลายเดือนก่อน

      I feel you and I've been on the fence of buying the plugin for a year! I hate it when makers of products do this, not care about building and helping the community thinking that their plugin is the answer to the universe and everyone will buy it because they have no choice. Newsflash, other plugins will come on the market, much better with better marketing teams behind them. I get your point to the bone.
      I will continue using it because there are some things I still can't make with gsap. I also like to test out new things :) will see how it goes.

    • @glencoe1266
      @glencoe1266 11 หลายเดือนก่อน

      Yep well said! Well keep these tutes going I am a big fan of what you're doing! :)@@andreaegli

    • @RADOS_A51
      @RADOS_A51 10 หลายเดือนก่อน +1

      Community is having a lot of empty responses, as people often hit multiple channels and they get replies usually via support ticket.
      People also tend to think that their environment is the same as everyone else. There are dozens of builder and millions of site configurations and plugins.
      And even with those difficulties, things work out of the box. We try to help people as much as we can via the official support channel (which is the Intercom widget on our site) and sometimes we even go further by helping people out.
      I am really sorry if you had some difficulties or that we did not help that much in your case, but bashing our product and telling things that are not true is also not okay.

  • @rakoss4137
    @rakoss4137 8 หลายเดือนก่อน +1

    what an hard explication for an easier things oh my god

    • @andreaegli
      @andreaegli  8 หลายเดือนก่อน

      Thanks for watching it anyway 🙃

  • @Zzjul
    @Zzjul 11 หลายเดือนก่อน

    Oh… motion page is 70,-

  • @anshultiwari6651
    @anshultiwari6651 11 หลายเดือนก่อน +1

    Too confusing 😑

    • @andreaegli
      @andreaegli  11 หลายเดือนก่อน

      Sorry to hear that. What was confusing?

    • @anshultiwari6651
      @anshultiwari6651 11 หลายเดือนก่อน +1

      @@andreaegli all the class/id names n naming stuff, it was as if you were also doing it for the first time, still I'm big fan of such stuff.

    • @andreaegli
      @andreaegli  11 หลายเดือนก่อน

      @@anshultiwari6651 I did do it for the first time, a day before. When you're filming and trying to keep everything going in the right order and talking at the same time, some times things can go wrong. I could have just switched things around during editing but i didn't on purpose to show that nobody's perfect and things can go wrong. I think you can still learn smth from the video if you just keep an open mind. Thanks for the input tho.