Interactive Elementor Landing Page Website Design | WordPress Elementor Pro Tutorial 2022

In this tutorial, I'll show you using Elementor Flexbox Container, How to Make a Bike Landing Page Website Design using Elementor | Creative & Unique WordPress Elementor Pro Tutorial!!!
✅ Get Elementor PRO:
jimfahaddigita...
✅ Get Tutorial Images & Code Snippets:
jimfahaddigita...
✅ Get Domain & Webhosting(70% off):
jimfahaddigita...
Subscribe Here: bit.ly/JFDtuto...
0:00:00 Overview
0:01:07 Landing Page Markup using Elementor Flexbox
0:11:03 Making Responsive Landing Page
0:13:33 Making Interactive Landing Page
Thanks for Watching!
✅ Become a WordPress Freelancer Today! Watch this Tutorial:
• Elementor Experts Netw...
✅ Get Domain & Webhosting(70% off):
jimfahaddigita...
✅ Hire a Pro Web Developer:
jimfahaddigita...
-----------------------------------------------------------------------------
And, Here are other Full Website Creation Tutorials using ELEMENTOR+WORDPRESS:
Elementor Masterclass 2022:
• How To Make A Digital ...
Portfolio Website using Elementor 2022:
• How To Make A STUNNING...
-----------------------------------------------------------------------------
-----------------------------------------------------------------------------
About:
10 Million+ website owners started using the Elementor page builder. I'll show you the easiest way how you can create your personal resume website using Elementor Page Builder yourself.
#WordPress #Elementor #LandingPage
If you're searching for how to make an eCommerce website, how to make a professional webShop from scratch, how to create an Online Store website step by step using woocommerce elementor, woocommerce subscriptions, WordPress eCommerce 2022 tutorial for beginners, woocommerce plugins, woocommerce payment gateway, best website making course, Elementor tutorial for beginners - then this tutorial is for you.
-----------------------------------------------------------------------------
-----------------------------------------------------------------------------
Like me on Facebook:
/ jimfahad.consultancy
And, lastly, If you want me to build your AWESOME website at an affordable price,
✅ You Can Contact me through my website:
jimfahaddigita...
Have a great day!

[@jimfahaddigital]

🔥Download Exclusive Elementor Templates: kitpapa.com 🔥

[@user-xo4lx1vm2o]

why don't you answer the questions?

[@user-xo4lx1vm2o]

I really liked your video but it does not work. I did each step as you said, but got nothing !

[@nadav12617]

@@user-xo4lx1vm2o same its not working

[@NaturaldeltaEN]

@@nadav12617 same not working

[@naveedanjum7078]

Not working

[@zafit02]

the problem of many other tutorials that do amazing things but completely forget about the mobile version, and it's totally useless, you always make it look great on any device, thanks!!!

[@hectordiaz1434]

For some reason the HTML code did not worked when I tried using my own images and I added one more control image. Please advise! Thanks!

[@murciaclubinfo]

Very good tutorial, although now I think that with elementor and the nesting option it can be made simpler, it wouldn't be bad if you made a current version, thank you very much master.

[@swamiprasanna]

Those who have issues with the background image not changing, I have a solution. Just change the position to fixed in the css code(ex: .bike-bg img{position:fixed;}). Previously the position is absolute and just change it to fixed. It is worked for me.

[@upbeataffiliate]

This is art! Epic work! Kept my attention the whole 25 minutes and 52 seconds. You are my inspiration ♥ !!! dude and your content are the best I've watched! You are so damn talented...

[@jimfahaddigital]

Means a lot!!! Thanks a million man!!

[@chawais6703]

It's not working when I put dynamic css. Help me please

[@DiogoSisti]

Hi great tutorial, but is there a update for the codes? did all stpes but not working, thanks.

[@robertodiaz1602]

Truly a genius!! Greetings from Argentina!

[@shagorahmed3240]

You are great. Thank you so much 😊

[@JuanitoOrtega]

I would like to do this but with dynamic content... please help. Thank you so much.

[@paolahenao3511]

good morning greetings from colombia I want to thank you for your tutorials are excellent, I have had a little probelmas to follow them because I know little English and youtube translation is sometimes bad but following the step by step I have succeeded again thank you very much really your tutorials are super great and have helped me a lot again thank you very much

[@geocloete]

Would it not make more sense to have a layout/design where when the bike on the right is clicked and become the main bike displayed that its thumb nail image gets replaced by the previously main displayed bike.

[@prokassim]

Awesome Jim, always looking forwards for your tutorials.

[@jimfahaddigital]

Thanks a million brother for your contentious support!!

[@prokassim]

@@jimfahaddigital You deserve it bro. I wish you all the best.

[@AhmadFareed-kj5cc]

I am having error when i uploaded custom css still it was showing all the bikes on preview

[@dolananmu]

hello, thank you for this great tutorial, but when i put in the dynamic CSS its not working, this work if my elementor is not for bike? because i put in for curniner photo

[@riazrahman3775]

can you please explain because its not working for me also

[@lumanik]

Hey Jim, I haven't been able to achieve it with the current version of Elementor, do you have any idea why that might be? Thank you very much, I am a fan of yours!

[@stephenorelli1490]

You're a rockstar, thank you! The active control isn't highlighted on load, just after it's clicked on (i.e. the black bike control image background isn't white at first). Other than that, perfect! If you have a code update to make the first control formatted to display "active" on page load that would be incredible too!

[@MrSlypire]

Hey Jim, yet another awesome video, big fan of you and your work. Is there any chance you have planned a tutorial for vertical scroll section, thats something I really want to learn with elementor..

[@jimfahaddigital]

Nice!!! Noted!! Thanks bro!!

[@brandonowen6637]

Hello Jim, Thanks for this wonderful tutorial but unfortunately the java script snippet or Dynamic CSS is not functioning properly. I have the most current version of Elementor Pro and I am using my personal pictures. Any chance you could reply with possible corrections? Thanks Much

[@jaikishanchauhan6346]

SAME ISSUE

[@lumanik]

Idem!

[@valdyd7639]

After insert custom css, why im still in 3 images in preview not changes ?

[@TECHVINES-tk8wi]

I'm also experiencing the same problem

[@RockstahRolln]

Thank you Jim for the terrific video as always!!

[@jimfahaddigital]

Yoo!! Thanks you so much for your continues support!! ❤️❤️😇

[@muhammadhasif9774]

mine is not working sir, i did follow ur every step but i still dont get it ...

[@DarkAnimeWork]

Sir, I have issues in bike bg image it's overlap all elements

[@emquads3516]

Great tutorial from Jim as usual - but it doesn't work on current version of Elementor ( 3.10.1 in my case). Only the left (text) column reacts.

[@deonbotha23]

I have the same issue, followed every step but can't get it to work?

[@victornavarro3379]

una lastima que deje de funcionar en las nuevas versiones de elementor, tuve que remplazar ese contenedor , gran contenido y gracias por compartir tu conocimiento saludos

[@lumanik]

Brother, did you find a way to do it in the current versions of Elementor?

[@blueinarts_]

Hello, How can I implement this with a plugin and without using css code?

[@darkhackingweb1958]

help me through this its not working after adding css and javascript can some one help me.

[@user-nz6ut4jg6p]

Thank you so much

[@henryszms]

Thanks for this amazing tutorial, Jim! I've just used it. Just one doubt: how can I move back to display the 1st "details-area" content on mouseout? Is it possible? Thanks a lot.

[@MjMwale]

Hi Jim, awesome tutorial. But how come i am the only one crying that it didnt work. Pls kindly assist. i have repeated and redesign it 4 times in 3 days

[@TECHVINES-tk8wi]

i followed every step on this video, but the interactive feature is not working on live preview. All the 3 bikes preview on the homepage. Help me

[@mrmartiaan]

same here

[@bindalenya2927]

Great tutorial Jim. I enjoyed every step of it. I do have a question though, can this be possible with a divi theme?

[@Sujon_khan_]

Genius

[@user-xo4lx1vm2o]

the css code does not work properly. I did all the things with your images but no results were given!!

[@shikhabajaj4995]

same problem

[@chawais6703]

It's not working when I put dynamic css. Help me please

[@coderprojahangir2103]

Brother after showing video i Learn huge. Now almost lv2 on fiverr

[@jimfahaddigital]

Wow!! I'm so happy for you!!

[@touringtime]

I have learned a lot of things from you. Thank you so much for making excellent tutorial.. ❤❤❤❤

[@jimfahaddigital]

Thanks a million for sharing brother!! I wish you all the success!!

[@campusconnecttv170]

Hello Jim, I really love what you do. Thank you do much. I've been trying to access your site but I can't, am I the only one facing this issue?

[@user-xm5fo8mh3s]

Hello, I have a question. If it had 5 elements, would it work or do I have to change something? thanks for your help

[@edmundosangines890]

Great job Jim. But I cannot get it to work on the newest version of elemento pro ¿ I don't know why?

[@panchalyagnank1472]

brother i do same thing but not working i try 2 times

[@thebrandvision20011]

Thank you so much dear❤ you are really JIN 😊

[@lumanik]

Did everything work correctly for you? I just tried to do it and I haven't succeeded.

[@thebrandvision20011]

Just copy paste the same names and follow each step correctly and same

[@KhangThai]

Awesome tutorials 😍always looking forwards for your tutorials.

[@jimfahaddigital]

Thanks man!! Means a lot!!

[@luizaugustocosta6781]

Wow! Jim, you are the best webmaster.

[@jimfahaddigital]

Means a lot!! Thank you so much Luiz!

[@suvirsroom245]

Thanks a lot, my brother, I will learn wordpress from youm, Thank you Brothers

[@jimfahaddigital]

Yoo!!! Keep watching brother!! 😇❤️

[@suvirsroom245]

@@jimfahaddigital Yeah Bro, I wanna be a web Developer also. So that I am watching your video, every video. Pray for me brother. If I have succeed, than I will give you full credit . Thanks Brother. by the way - Are you Bangladeshi ?

[@erbhimsensahoo]

THANK YOU SO MUCH FOR THE TUTORIAL 🥰😍❤

[@Localvaakya]

Followed each and every step but it was not working. Can you please help me? Rechecked multiple time but interactive part is not working.

[@harsh_kht]

Everything works finr except the background change effect. If anyone can help me solve that. Please do

[@nesrinelbeltagy5191]

Thanks jim for this amazing video please make more and more for landing page videos

[@jimfahaddigital]

Sure thing!! Thank you so muchh Nesrin!!

[@smnurulislam]

Awesome Tutorial as always. Thank you so much for your advance tutorial.

[@jimfahaddigital]

Means a lot!! Thanks Nurul brother!

[@MdShahAlamMia-pv3in]

Great job Jim Bhaiya. But did't work on the newest version of Elemento Pro. Please give solve the issue

[@frizzamedia5967]

welcome back Jim Fahad, i was waiting for you to comeback after long Times 😭

[@jimfahaddigital]

Thank you so much!! I personally missed these tutorials so much... haha! I've thousands more to offer!! 😀

[@frizzamedia5967]

@@jimfahaddigital that's great! where have u been by the way

[@abusuhailah4750]

@jimfahaddigital You really are an inspiration sir. Thank you for everything. Please my question here is, what if I want the background and contents to be changing with timing. Without clicking. What should I change?

[@muhammadrabi1439]

Dear this is not working on my end. Can you tell me additional settings so that it will work fine??

[@joaoalmeida4380]

Good work!! I’m wondering if it is possible to do this with Divi Theme… any suggestions? 😅

[@jagmeetkaur8496]

This is really a nice, I have done this design on my customer Website but because of elementor updates it’s not working. Can you please help me

[@dandale724]

You are the Best. Thanks!!!

[@fliskyflake]

how did it work for you?

[@piedraspiedrahita]

it only works with you images? im triying but it dosent work

[@user-rj5sq9xc2h]

Hi Jim, Thank you so much for your tutorial. It looks amazing! Will you be doing an updated video for the latest version of Elementor by any chance? Thanks again

[@jimfahaddigital]

Yes!! This Monday! ❤️❤️🔥

[@samgupta143]

Thanks, Jim for this amazing video, Really it motivates us. This amazes us, we can do this type of stuff also. Great!! Bro

[@jimfahaddigital]

Wow!! Thanks a million Sam brother!!

[@ZeptejSeFilipa]

These tutorials are brutal! THX

[@jimfahaddigital]

Haha! Thanks a million bro!!

[@juniormptx]

Great!! Great!! Great!! thanks Jim

[@jimfahaddigital]

Thanks a mil for appreciating!! Yay!!

[@kristapskk3409]

Thanks. All the same for FREE version is easy to create just jump to different pages once you click on bikes :))

[@jimfahaddigital]

Haha!! Not at all!! You may have more content underneath this banner. This could be in the middle of any page. When you have CLICK option, why would you decide to load it on a different page. Very very bad UX that would be. haha!

[@riyadhjerjo3393]

Great Job! Thanks a lot.

[@reneh2004]

Awesomeness!!

[@chawais6703]

It's not working when I put dynamic css. Help me please

[@CreateCrest]

Please sir make more tutorials for LANDING PAGE DESIGNING it will help us a lot.

[@jimfahaddigital]

Sure I will. Thank you so much!!!

[@daviddjollo1923]

This is dope !!! we learn a lot from you... really thks... Please can you do a video of a landing page where we can choose storage and color of a phone before to click on buy.. pls

[@jimfahaddigital]

Awesome! Noted!!

[@daviddjollo1923]

@@jimfahaddigital thks🙏

[@user-fu8qp6gf8c]

You are my new bestfriend Jim ! =D

[@MrCamdere]

Wow need more Videos like this thanks bro

[@jimfahaddigital]

Tons more are coming!! Yooo!!

[@veroniquepuderecki5995]

Hi Jim, thanks for this tutorial; but I am having issues making it work. Followed the tutorial to a T. All three containers within the details-area containers are showing despite the correct settings. Your help is appreciated, thanks in advance.

[@deonbotha23]

I have the same issue, followed every step but can't get it to work?

[@veroniquepuderecki5995]

@@deonbotha23 Hi there, i was playing around with the nested tabs today and have this layout figured out if you are interested, let me know!

[@user-rj5sq9xc2h]

Hi @@veroniquepuderecki5995 , would you be able to post the solution if possible? would be greatly appreciated! Thank you

[@lumanik]

@@veroniquepuderecki5995 Do you know how to solve it in current versions bro?

[@qaemn.m5223]

Didn't work!

[@MrDananjaya]

i paste codes but i wont work it show three images an d titles ? plz help me

[@DigitalDesigns1]

Amazing tutorial..

[@claudiofuentes9880]

can the background become a slider? at the same time?

[@teuccio73]

with transition options!

[@mlstradingschool6717]

thanks bro very nice tutorial.

[@HildaGarza-qp8ct]

sir i did it but it wont show as urs it still show 3 3 3 for each

[@Sandraempire9888]

Jim is my mentor

[@chawais6703]

It's not working when I put dynamic css. Help me please

[@kamilkozio7992]

I dont know why but its not working in my case :

[@phantom_Video]

Thanks for information 🤩 very useful information

[@jimfahaddigital]

So nice of you 😍

[@gittarpikk]

Please tell me you have this template offered somewhere . I need is the template as I will be changing the layout to mimic a much more modern and interactive version of my html site I designed in 2010. I used product picture icons the lined both right and left columns . Just a lot more products than 3 bikes.

[@moinulislamhemel7041]

just awesome design u r really creative anyway tnx

[@jimfahaddigital]

Thank you so much!! I really really appreciate it!!

[@chawais6703]

It's not working when I put dynamic css. Help me please

[@fernandorusso9359]

se puede hacer con jquery en ves de js vanilla

[@Jc-si6pj]

Nice dude !!

[@jimfahaddigital]

Means a lot!!! ❤️❤️😇

[@crazay3983]

Hey im getting an error Uncaught TypeError: Cannot read properties of null (reading 'data'), It works in elementor but doesnt appear in the original site

[@amirsharbati022sharbati5]

When I put the code, the page turns completely white, it doesn't work at all😑

[@ahrorxoliqov5710]

don't work this code, please help me

[@Animated__stories]

Sir how to download wordpress website in zip format and then import on another WordPress dashboard.

[@Tamara.Gafniel]

very smart

[@sheraz_ahmed]

Amazing

[@jimfahaddigital]

Thanks a million!!

[@hoomantech]

hello what theme you used ?

[@islamreels1061]

Legend.!

[@jimfahaddigital]

Thanks a mil!!! 😇😇❤️

[@informationsharing1169]

Good tutorial sir, I have learned a lot of things from you. I always follow you. Sir, I would like to a request to you if it is possible to create a landing page with free Elementor, and free resources and give a video it would be better if you give it according to the format that the customer wants.

[@mdraju5031]

why its not work properly at me please helep me sir

[@movitsolution]

What a wonderful tutorial. This is awesome and self explanatory. Thanks a lot. However, i have a problem implementing the interactive features. I did exactly as you did in the video but i am nit getting the result as displayed in the video. After inserting the java script and the xustom xssm it still displays as it is on the elementor editor. pls what do i do

[@deonbotha23]

I have the same issue, followed every step but can't get it to work?

[@trevorpowell4851]

I just finished the video as well and it doesn't work. I checked that I named everything correctly and and had the right containers for the css java script and I do but it doesn't hide the other objects.

[@hyggepress]

Not working

[@bilalnaveed1101]

Nice ❤

[@jimfahaddigital]

Thanks a million!! ❤

[@2clicktopic464]

What code is responsible for hiding the other 2 elements on the page?

[@cloudinfrastructureservices]

not working unfortunately, same issue as other users on the latest elementor pro

[@Animated__stories]

Hello sir , I have a wordpress website on infinity free (free hosting) and i want to download or export my complete wordpress website but i am unable to do it bcoz of 10 mb max size limitations , can anyone please suggest me any idea to export my wordpress website from infinity free and import on another hosting.

[@naveedanjum7078]

It is not working