How To Make Your Website Mobile Friendly | Elementor Responsive Tutorial
HTML-код
- Опубликовано: 11 окт 2024
- Making sure your website is mobile friendly is more important than ever. In this video, I will show you how to use the responsive settings in elementor to make your website mobile friendly and make it look amazing on any device or screen size!
Chapters:
0:01 - Intro
1:55 - Where to find elementor responsive settings
2:59 - How to make the mobile site display different content
6:29 - How to create mobile specific sections
This video solved my biggest problem today😃..thank you so much for this....🙏❤️
I was having an issue with change on mobile view messing up my desktop view. Then when I fixed the look on desktop it changed and messed up mobile again..I was at my wits end. But this video helped. I just made duplicates of each section and edited each one different for different modes. Time consuming a little bit, but it worked. Thank you!
Glad I could help you!!
I can’t even explain how grateful I am for your video, it helped me finish my assignment on time. Thank you so, so much! 🙏🏼
Finally, after exploring tons of videos. I got a solution from your video. Thanks alot
This was the most helpful video I found on the internet. You saved me so much time thank you
AWESOME!! I'm always posting new videos with helpful info! Feel free to subscribe to see more
Damn u saved me man. I initially thought all the settings in tablet mode and the desktop mode were different but I found out that it actually rearranges the things if I do that on either mode. Because I want sections to be shown differently on desktop and mobile. So to display on mobile I was rearranging them which was breaking my desktop page. Great tip
Thank You !!! I've been looking for someone who could explain this in the way that you did, you make it seem effortless yet precise. Thanks Again !
Thank you, your video was clear, concise, and easy to follow!
You've taken the angst out of mobile friendly design.
Great job this is exactly what I needed to see. I knew it was not right when I was researching and thought I needed to change theme or get paid plugins.
Thank you so much. I watched a few other videos and they were horrible. You video was a joy to watch in a number of ways. Thank you.
Thank you so much for this. Short, simple, and straight to the point. ❤
thankyou. this is exactly what i have been looking for for 2 weeks
Great great VIDEO Thankyou look fwd to the MEGA MENU video please notify me
Whenever I adjust something in mobile it throws off everything else in desktop and tablet. Elementor is the worst.
Great video, I have been having this problem for months. thank you
Thank you so much! This is finally the solution I've been looking for! 🙏
That's awesome to hear! I'm always posting new videos with fresh ideas and solutions and tips! Feel free to subscribe to see more :)
Thank you very much for this tutorial, it saved me a ton of time! Very logical, great work!
Great video, simple and to the point thanks - what’s the chrome plugin on the left you used pls?
thank u soo much enmanuel ..it is very help full...liked
you just gave us a wonderful Boost. So thank you very much guy. May God bless you
Great, clear explanation. Well done. Thank you!
Thank you!!!! You are the best!
You are an EXCELLENT TEACHER.
the only video that’s helped. thank you.
Brother you are a genius thank you so much
Hello Enmanuel, great video, thank you! Is there a way to edit global fonts for Mobile so they will update across the site on mobile devices?
Thank you. This was really helpful. God bless you
This was amazingly helpful, thank you so much!
EXCELLENT PRESENTATION‼️‼️👍
Hi, when I try to change things on mobile view, it automatically changes it on desktop--how do I fix this??
Thanks a lot! Very helpful video.
Thank you for your help, sir! this is really very helpful!
This is a really good video. Thanks
Incredible how many people you get to help
Thanks, Enmanuel
Thank you so much exactly the explanation I needed
Very helpful. Thanks
Well done bro
Thank you. Very helpful. Amazing job.
Thumbs Up.. you saved me👍
Thanks a lot Emanuel. Just what I was looking for.
IDK what my problem is, my mobile version looks terible no fonts or formatting at all; random logos and images all over, the mobile version of all my site pages look great in the elementor editor but when you navigate to the site on your phone its a train wreck...
Thanks a lot. You've got a new subscriber
great...very very great to learn from you...
Hello, what more would you like to learn?
Thank you so much brother
exactly what I need! Thank you!
Thanks man u saved my time
Enmanuel thank you, it was very helpful
would you mind if you tell us about hero image size for mobile and desktop and laptop ?
You are grate .....many thanks
Thank you, you the goat :)
Omg you are my hero!!! Thank you so much!!!!
Glad it helped!
Thanks very much that was really helpful !!
Are you using elementor pro..?
Thanks in advance...
best vdo
Thank you so much 😀
Great video. I have different kinds of problems with my website.
1. When I update plugins my website goes down.
2. I also have a problem customizing my website to make improvements on the site.
Kindly advise
Thank you for helping!
Question: What is the Extension you use for responsive on Chrome?
Great video, thank you very much!
U r the best sir
no, YOU are the best!
wow, looks easy! thanks for your help!
THANK YOU SO MUCH
excellent bro
Awesome video!
Ok, I did this last year. The only thing I don't like about it, the mobile info can be confusing when I am working on the desktop mode.
Enmanuel Diaz, can you make different Logos and Headers specific to Mobile devices only? I cannot seem to get my Logo to work with my mobile Design
Yes! Add in 2 different versions of your logo and make one only display On desktop and the other only display on mobile.
Another option is make 2 version of your header, one only for desktop and 1 only for mobile.
I have a question. If you make Section for each Desktop, Tablet, Mobile, then you increasing the page size, which will affect the website speed. I am right?
Yes, this is correct. That’s why it’s good to make some sections that are responsive and work for multiple sizes at the same time
Yes bro I want to know how to make a mega menu....❤️
Thanks Man
The problem is despite looking good on my computer (Desktop, Mobile and Tablet), when I browse my website on my mobile phone, it looks completely different than displaying on the elementor.
Can you show us how you made that jewelry website?
When I make changes for mobile, that changes desktop and I have tried everything! I don't know what else to do.
Thanks
When I am doing the mobile edits on my wordpress through Desktop it shows fine but then when i check it on my phone, its sloppy :(
already qualdrupled your likes - and - i will also subscribe... thank you!!!
What theme you were using by the way
Thank you!
Is there anything else you would like to learn?
which on is the best, bulid with full elementor canvas or using theme?
I would use a theme, if you use elementor pro you can use the theme builder
Nice way ;)
Will you be making a video on how to edit a header to work for mobile and a desktop in Elementor non pro? Like T-tradenow asked same issue here.
You can use the same techniques shown in this video to make adjustments to the mall version of your header, or create a separate header just for mobile. I will work on making a video for it
How can I make my background image fixed on the mobile version on ELEMENTOR FREE?
Easy!
Thank you very useful video
Thank you! Please let me know anything else you would like to learn?
@@EnmanuelDiaz Yes I'm adding a picture to the text editor, can I make that picture both mobile alignment and pc alignment? I couldn't do it, so I'm redesigning the site, adding 2 columns, I'm thinking of adding text to one and text to the other.
@@Fariz.Mammadov yes! Adding the image as it’s own element will make customizing it MUCH MUCH easier!
Looking for 2 column in mobile view how to do it please
May I know what chrome extension you were using to switch between screen sizes at 6:03?
Yes, it's called "Window resizer" you can save different window sizes and then switch between them easily.
is elementor in sitepad sir
There's always a workaround where the orthodox route doesn't work. Thanks Emmanuel.
But this is showing to make it look good on all size screens. Sometimes what you put on the mobile version still shows up different when seeing it on a real phone. I have used percentage instead of px when clicking advanced and it still is off.
Yeah it can vary because every device is so different. Sometimes what I do is duplicate an element or a whole section to create a mobile only version of it!
Hi, when I try to move the background photo in the right position for the cellphone version, i do it, then update, but when i look on the cellphone or go back on elementor again , its again out of position, does anybody know how to solve this?
You might need to clear the catch on your mobile device for it to show the updated image settings, you can also check that the elementor mobile size matches the size of the device you are checking on. You might want to consider using a different image for mobile that fits better for a vertical layout.
@@EnmanuelDiaz HI thanks for the reply, it was continuing to go out position because the cellphone version image used was set to fixed , should of been on scroll lol, working perfectly now. Thanks for the advice , will keep that in mind if I expierence other similar difficulties.
@@ZinedineKhabib great to know! There are always so many different things that can happen lol let me know if there is anything you’d like to see a video about
How to do the same for top menu?
What do you mean?
@@EnmanuelDiazI have added my email id in top menu. I want to display the top menu(email id) on desktop view but to hide in mobile phones.How can I do that?
2.Similarly in my cart page or in my checkout page,Shipping is not calculating on cod since I had enabled shipping from seller side and from admin side.I dono where the mistake is?Help me to fix that.
@@peacefulgarments6994 you can do it the same way I show in the video. However you will need elementor pro to be able to edit your header and footer.
If you have elementor pro, edit your header and you will have the same options to hide and show sections, just like you do on the pages
@@EnmanuelDiaz But I don't have pro,Can I edit the header in some other ways?
LOOKING FOR SOMEONE TO HELP BUILD MY WEBSITE THIS IS TOUGH
I would be happy to help, we can set up a meeting here: icreateyoursite.com/1-on-1-website-help/
what you shown us and what you do?
What?
theres no inteligent plugin for all this?
Fast reliable cm?communication
wtf is this? I'm here for lines of code..
wtf
What?
Learn to code properly. Wordpress and elementor all that is crap.
why did you click an elementor video?? lol
@EnmanuelDiaz had to learn it for a paper at uni. Building with html, css and Bootstrap is the way to go
my website is pc friendly, tablet friendly but when i visited the mobile point of view, i saw that my top first image is stretched all the way and i have to scroll down too much just for that image to end, can you help me fix this?
if you need visual representation of my problem tell me your social and ill send you the picture of it. plz plz plz help me with this since i am a newbie