Nice and well explained. 1 question though: what to do when devices are used in landscape mode? The layout will change dramatically and I do not know how to fix that. If possible.
Good luck getting an answer. Basically you are expected to buy a premium addon to manage breakpoints. Yes premium addon for a premium plugin. Or the other choice is to code in breakpoints by accessing the element level css, which is a dirty way to do it though
dont use elementor, there is a thread on a forum asking for responsive options like landscape mobile, elementor team member was on that thread, and its been years they ignore it like it doesn't exist. divi now has it built in, I made a mistake choosing elementor 3 years ago and regret it
@@joshbarry9824 lol divi with it's lock-in-effect mentality. and as mentioned, additional breakpoints exists in elementor. you just dont know what you talk about
Aviva, thanks so much! This was the Elementor "Responsive" Tutorial I've been looking for. FYI - I had to actually slow down it down to .75 instead of speeding it up to 1.25 as I do for most tutorials.
0:00 - 01:01 - Intro - What We’ll See in this Tutorial 1:02 - 04:08 - Elementor’s Responsive Features 2:58 bigger screensize will automatically pose its styles onto the smaller screensize ( desktop to tablet and phone) but NOT vice versa. 2:59 ??? how ???? -> smaller screensize will intuitvely know how to change width and adjucst to the screensize. ??? 2:59 2:59 4:09 - 05:59 - Responsive Menu 6:00 - 07:47 - Column Width & Wrapping 7:48 - 08:48 - Responsive Font Styles 8:49 - 09:34 - Hide and Show Elements on Different Devices 9:35 - 10:08 - Reverse Column Order in Different Viewports 9:51 goto responsiveness -> reverse coloumn for (tablet) .... see from 9:35 10:09 - 11:24 - Hide & Show Elements - Best Practice 11:25 - 12:12 - Responsive Widget Options 12:13 - 13:56 - Recap - What We Learned in this Tutorial
Hi Travelling, I recommend posting your question in the Elementor Community Facebook group. You'll be able to share screenshots and more information about this issue, and get great advice from other web creators: facebook.com/groups/Elementors/permalink/3707554449370314
Great tutorial BUT how do I make it responsive for different desktop screen sizes? Let's say a user wants to have half of their screen used to read something on my website and the other half for something else, even though my site is responsive for mobile and tablet it doesn't adjust automatically for a change in desktop sizing
If I check my Elementor site from my laptop is looks completely different than my desktop. This program is crazy and is all over the place. Plus, if I make any changes in Tablet and mobile it absolutely effects Desktop view.
Hey KungFury, thanks for comments. Please check out this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html. Only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes.
Hi @@Elementor ,I have a very similar problem, every time a modify the size of the browser window in desktop mode, the vertical position of the first section elements moves, even if if the windows did not match the tablet or mobile phone size criteria. How can I get it to not change its vertical position regardless of the window size ? (maximized window on screen or smaller window size on screen). Thank you.
@ellayararwhyaych4711 please check out this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html. Only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes.
@@Elementor i am still having the same problem with them.When i chose the mobile icon, and made some changings, the changes will effect all the other devices. 😰
Please could you do a tutorial about the responsive navigation menus? I always have the same problem with the length of the hamburger menu for Tablet and Mobile. It is always or too long ( and out of sight ) or too short ( what is ackward ). What is the treat to have a responsive menu on tablet and mobile for all type of devices? Help me please!
Very nice and clear explanation. But please can we stop this sloppy hiding, showing and copying sections for mobile (and other) devices, it just adds bloat and can be very confusing when you have many sections on a page. We should be able to change content per device like another page builder (cough *Divi* cough). Thanks.
Very benefits, thank you. But i've a question :When i edit the mobile responsive, the tablet and desktop responsive change too. What to do for this case? Please help me Thank you
Hi Boss, check out this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html. Only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes.
sadly, they(elementor) doesn't really anwser our question. So many users have the same problem, they only copy the same video link which couldn't solve our problem AT ALL.☹
Good explanation but I think there is lot more to successfully making a responsive site. I am looking for a way to get buttons over a hero image in responsive mode.
all fine and neat!! But what with Computer Desktop vs Laptop????? elementor gives us option to between desktop, tablet and mobile but there should be a option to for laptops. because most of all the webdesigner work on computers with bigger screen .
can you please tell me why is changing design setting is phone or either tablet mode is also changing design\ setting in my laptop mode in elementor pro please reply
Hey @AnkitVerma-sv5sl, only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes. Please see this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html
Hello, how do I keep the same deskopt design for different resolutions? I work with a Laptop and two additional bigger screens. I designed a mega menu with a plugin and elemntor pro, but when I put the browser window on my laptop (which is smaller) the design is totally messed up. Do I need to focus on specific widgets and instructions e.g. font px or anything?
in Elementor I see the tablet correct, but on the tablet the images don't have the same size, I have cascading containers like landing page with maximum width
This was very helpful I'm older with bad eyes and sometimes Aviva moves too quickly. She DOES and then when she has done something the tells us: "Let's do it" and I get lost. But, this time I was able to follow along. I strongly recommend going to settings >devices on her computer and making the cursor larger. Also, a webcam pointing at a 15-degree angle to the screen might work so you can point with a pen tip to something you are demonstrating. This was helpful. Combining study with Aviva and Wes McDowell I'm beginning to "get it."///// I want to remind new editors," Don't go crazy for more gimmicks. Times change. People do not. Pictures draw the eye. WORDS SELL. This is advice from the greatest marketers and advertising guys in the world. Therefore, write more and use things like sliders less. You can get started with basic Elementor FREE and there are enough free sample plugins to do most of what you'll want. Buy Pro after you know what you're doing a bit better and are earning some money. Elementor's competitors are very expensive and intended for their own page templates. I think staying with Elementor is your best choice. You can find many FREE site templates instead of the free Hello Theme. The newer Themes/templates are optimized for everything and kept up to date so you'll always be in good shape.
Hi Danna, only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes. Please see this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html
Thank you, this was very helpful! But how do we fix things that run off the page (not just wrapping like shown in this tutorial) for tablet and mobile views?
Mine is not allowing me to edit my Nav Menu. Please help. this has been stopping me from launching my bog for weeks now. As the the menu is not showing on mobile.
i use Elementor header and footer plugin to create both it works fine easy to use but for responsive in tablet breakpoint the header menu is not show anything. HELP!
Hi @Elementor, I have a very similar problem, every time a modify the size of the browser window in desktop mode, the vertical position of the first section elements moves, even if if the windows did not match the tablet or mobile phone size criteria. How can I get it to not change its vertical position regardless of the window size ? (maximized window on screen or smaller window size on screen). Thank you.
Hi Daniel, there could be a few reasons for this. Can you see the orange "Edit Header" handle? If not, you may have the free Hello theme header activated, which can not be selected from the page. Instead, it is edited from the Site Settings. If you can see the Edit Header handle, but can't select it, open the Navigator (CMD or Control + I) and try hiding the first section/container of your page (hover over the section in the navigator and any eye icon with appear, click it - it only hides it while you work, not from the live page). Try to select the header. If you still can't select it, you can edit your header from the Theme Builder. If you're still stuck, please contact support from your Elementor account dashboard my.elementor.com or you can post your question in the Elementor community. You can share screenshots and links there as well: facebook.com/groups/Elementors.
Hi Jula, the Global styles are available in all versions of Elementor, including free. You can access Global styles from the Elementor Editor: th-cam.com/video/CjdFxKPPikU/w-d-xo.html
Why I don't have Align (5:33) and mobile dropdown in my content settings? also responsive mode - the way you view tablet and mobile here is different from mine, do I have other version or just missing something?
Hi George, thanks for your questions. Some of the responsive features have been updated since this video was published, but the general concepts remain the same. You can see the updates here in this video: th-cam.com/video/i1yTLQ9R-Yw/w-d-xo.html.
How to resize products archive in elementor while doing the responsive?, doesnt gave me the option to to this, and cannot find the container main selector to resize that product archive y.y
Nice, 1 question: When applying a scroll effect in a motion effect, using horizontal scrolling causes the drag to move erratically left and right on mobile. On mobile, it should only have to drag up and down. I want to create an image that disappears left and right through motion effects, is it impossible? There is no problem on the desktop, but on mobile, there are problems when dragging.
Hi Trọng, these kinds of things can be difficult to troubleshoot without screenshots and more information. Have you joined the Elementor Community? It's a great place to ask questions like this, and get solid advice from other web creators. And you can share screenshots and links there as well: facebook.com/groups/Elementors.
Hi Leopoldo, these kinds of things can be difficult to troubleshoot without screenshots and more information. Have you joined the Elementor Community? It's a great place to ask questions like this, and get great advice from other web creators. And you can share screenshots and links there as well: forum.elementor.com.
Please, different settings for different devices can you have just with pro version? Not with elementor basic? Because I tried to get responsive for mobile but edit get also in desktop and in the other way around so no different responsive for different devices
Hi Salvatore, thanks for your question. Responsive settings are available in the free version of Elementor, as well. Please check out this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html. Only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes.
HELLO... I listened to your video regarding editing Desktop, tablet, and smartphone formats. Your video states that editing the format on a smartphone does not affect formatting on a desktop. This is not what happened. Changing the position of an image in phone mode messed up all my formatting on my tablet and desktop. I'm running Elementor on an Astra theme thats been gutted of any interference. What do you suggest?
Hi Rev, only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes. Please see this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html
@@Elementor sorry, that simply is not true. I'm talking about settings that do have viewport. I'm using guttenberg now and when you make a change on the phone view it does not change anything else.
Hey Rev, these kinds of things can be difficult to troubleshoot without screenshots. Have you joined the Elementor Community? It's a great place to ask questions like this, and get solid advice from other web creators. And you can share screenshots and links there as well: facebook.com/groups/Elementors. If you're an Elementor Pro subscriber, you can also contact support directly from your account dashboard.
Hello. You say that the computer version modify the tablet and phone version but when I change directly the mobil version it also change the computer version ? Why that ? tutorials on youtube always say "how easy it is " to change differents version but it is a nightmare until now for me. Nobody explain why there are changes on computer version without wanting it.
Hi Jean Claude, thanks for your question and comments. Please check out this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html. Only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes.
Hi Shifting, please check out this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html. Only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes.
Hi Laura, these kinds of things can be difficult to troubleshoot without screenshots. Have you joined the Elementor Community? It's a great place to ask questions like this, and get great advice from other web creators. And you can share screenshots and links there as well: forum.elementor.com.
Hi Joanne, settings that do not have viewport icons next to them will apply at every screen size. Only settings with the viewport icon are device specific. See here: th-cam.com/video/EqFxeluk4U4/w-d-xo.html. Let me know if that solves your issue.
exactly same problem i am also facing i made a beautiful website it's looking great in desktop but when we open it in mobile it sucks every icon has a viewport icon but still changes happing on every screen format i don't understand
thanks for this! I am looking to make the width of the slider carousel on the background of the hero section narrower. I have done it by adding to the 'additional css' code for width = 70%. I also added right = 0. It made the carousel slider central, but then after fiddling with other stuff, and making the width smaller it wasn't central. On css there is no 'horizontal-alignment : center' so not sure what to do. What do you suggest please? Thank you very much!
Hey mcelia I recommend reaching out to support through your account. They will be able to look into what is happening with your header and help you out.
The best thing you could do is allow for a range of breakpoints to be selected and then it doesn't change until it hits said break point. I don't want my screen scaling indefinitely until it hits that breakpoint, it is obnoxious and goofy AF
@JamesStrong, please check out this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html. Only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes.
no it's not right if am changing any thing in mobile view it gets changed in laptop and tablet also which disoriented the structure of complete website i tried every way i am out of ideas how can i fix this issue
Hi Amit, thanks for your question. Only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes. See this part of the video to review it: th-cam.com/video/EqFxeluk4U4/w-d-xo.html.
Hi Pintor, please check out this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html. Only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes.
Hi Alexandre, I recommend posting your question in the Elementor Community Facebook group. You'll be able to share screenshots and more information about this issue, and get great advice from other web creators: facebook.com/groups/Elementors/permalink/3707554449370314
Oh I wish this were true. I edited a mobile element and went back to the desktop and it had changed and was not expecting that and had to go back into history and fix it. Not sure what to do. Guess I will have to experiment. And right when I thought I was about done.
Hey @nikkilesley2525, only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes. Please see this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html
When I change something on the tablet mode, say move a section because it's positioned wrong and text is bunched up it then moves on the desktop. How do you move and position sections so they aren't all over the place. too long and why does the featured image become too large. I thought Elementor was intelligent when you change modes? Why is this happening? I'm getting frustrated using Elementor. In theory it sounds great but in practice not so much.
Hi CProton69, these kinds of things can be difficult to troubleshoot without screenshots. Have you joined the Elementor Community? It's a great place to ask questions like this, and get solid advice from other web creators. You can share screenshots and links there as well: facebook.com/groups/Elementors.
Hi CProton69, I had the same experience and it does not match the results of this tutorial. When I move an image on smartphone formatting, it messes up the formats going up the chain which this video says it does not. Did you find a solution?
Hi Joanne, I recommend posting your question in the Elementor Community Facebook group. You'll be able to share screenshots and more information about this issue and get great advice from other web creators: facebook.com/groups/Elementors/permalink/3707554449370314
Hi SK, we're happy to have you with us :) Stay tuned for even more responsive editing options, coming soon: github.com/elementor/elementor/issues/15797
This isn't working. You say that larger screen sizes don't inherit the changes made to smaller screen sizes. And yet, every single time I make changes for my websites mobile layout, it also changes the layout for desktop... What you say happens is not actually what IS happening. This doesn't work. And I have found numerous other people online who have been complaining about this same exact flaw, and still there are no good answers or solutions from Elementor.
Hi Black, thanks for your comments. Please check out this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html. Only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes.
yes, soooooooooooo many users are telling them same problem, but they didn't listen, except copy the same vidoe link which doesn't solve our problem. the truth is, elementor responsive mode DOEN'T WORK! untill 2024.05.23.
Nice and well explained. 1 question though: what to do when devices are used in landscape mode? The layout will change dramatically and I do not know how to fix that. If possible.
custom breakpoints by addon or css
Good luck getting an answer. Basically you are expected to buy a premium addon to manage breakpoints. Yes premium addon for a premium plugin. Or the other choice is to code in breakpoints by accessing the element level css, which is a dirty way to do it though
dont use elementor, there is a thread on a forum asking for responsive options like landscape mobile, elementor team member was on that thread, and its been years they ignore it like it doesn't exist. divi now has it built in, I made a mistake choosing elementor 3 years ago and regret it
@@India.stories not true, simply activate the additional breakpoints in elementor, there are so many, so you can style every single detail
@@joshbarry9824 lol divi with it's lock-in-effect mentality. and as mentioned, additional breakpoints exists in elementor. you just dont know what you talk about
Aviva, thanks so much! This was the Elementor "Responsive" Tutorial I've been looking for. FYI - I had to actually slow down it down to .75 instead of speeding it up to 1.25 as I do for most tutorials.
0:00 - 01:01 - Intro - What We’ll See in this Tutorial
1:02 - 04:08 - Elementor’s Responsive Features
2:58 bigger screensize will automatically pose its styles onto the smaller screensize ( desktop to tablet and phone) but NOT vice versa.
2:59 ??? how ???? -> smaller screensize will intuitvely know how to change width and adjucst to the screensize. ???
2:59
2:59
4:09 - 05:59 - Responsive Menu
6:00 - 07:47 - Column Width & Wrapping
7:48 - 08:48 - Responsive Font Styles
8:49 - 09:34 - Hide and Show Elements on Different Devices
9:35 - 10:08 - Reverse Column Order in Different Viewports
9:51 goto responsiveness -> reverse coloumn for (tablet) .... see from 9:35
10:09 - 11:24 - Hide & Show Elements - Best Practice
11:25 - 12:12 - Responsive Widget Options
12:13 - 13:56 - Recap - What We Learned in this Tutorial
thanks buddy
Hi I am trying to edit on phone view but the changes comes on desktop and tablet view as well, kindly help
Hi Travelling, I recommend posting your question in the Elementor Community Facebook group. You'll be able to share screenshots and more information about this issue, and get great advice from other web creators: facebook.com/groups/Elementors/permalink/3707554449370314
This is the same old clunky system which has never been updated. We need advanced breakpoint management yesterday
Great tutorial BUT how do I make it responsive for different desktop screen sizes? Let's say a user wants to have half of their screen used to read something on my website and the other half for something else, even though my site is responsive for mobile and tablet it doesn't adjust automatically for a change in desktop sizing
If I check my Elementor site from my laptop is looks completely different than my desktop. This program is crazy and is all over the place. Plus, if I make any changes in Tablet and mobile it absolutely effects Desktop view.
Hey KungFury, thanks for comments. Please check out this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html. Only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes.
Hi @@Elementor ,I have a very similar problem, every time a modify the size of the browser window in desktop mode, the vertical position of the first section elements moves, even if if the windows did not match the tablet or mobile phone size criteria. How can I get it to not change its vertical position regardless of the window size ? (maximized window on screen or smaller window size on screen). Thank you.
2:40: "And tablet edits don't affect desktop"
@ellayararwhyaych4711 please check out this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html.
Only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes.
I'm editing only settings with viewport icons for a phone viewport, but it's still taking effect all over the devices !@@Elementor
@@mrfifasa2960 yes, me here the same problem.
@@Elementor i am still having the same problem with them.When i chose the mobile icon, and made some changings, the changes will effect all the other devices. 😰
Please could you do a tutorial about the responsive navigation menus? I always have the same problem with the length of the hamburger menu for Tablet and Mobile.
It is always or too long ( and out of sight ) or too short ( what is ackward ). What is the treat to have a responsive menu on tablet and mobile for all type of devices?
Help me please!
Very nice and clear explanation. But please can we stop this sloppy hiding, showing and copying sections for mobile (and other) devices, it just adds bloat and can be very confusing when you have many sections on a page. We should be able to change content per device like another page builder (cough *Divi* cough). Thanks.
Very benefits, thank you. But i've a question :When i edit the mobile responsive, the tablet and desktop responsive change too. What to do for this case? Please help me
Thank you
Hi Boss, check out this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html. Only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes.
sadly, they(elementor) doesn't really anwser our question. So many users have the same problem, they only copy the same video link which couldn't solve our problem AT ALL.☹
Good explanation but I think there is lot more to successfully making a responsive site. I am looking for a way to get buttons over a hero image in responsive mode.
All fun and games, only that almost none of the options or elementor menu is the same anymore. So this video is kind of useless at this point
all fine and neat!! But what with Computer Desktop vs Laptop????? elementor gives us option to between desktop, tablet and mobile but there should be a option to for laptops. because most of all the webdesigner work on computers with bigger screen .
I’ve found you have to use scaling values for your section sizes such as vp or % if you use pixels it goes weird
Thx for your answer.
can you please tell me why is changing design setting is phone or either tablet mode is also changing design\ setting in my laptop mode in elementor pro please reply
Hey @AnkitVerma-sv5sl, only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes. Please see this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html
We need Mega Menu, Table Texts, Multiple locations pin 📍 on google map.
Hello, how do I keep the same deskopt design for different resolutions? I work with a Laptop and two additional bigger screens. I designed a mega menu with a plugin and elemntor pro, but when I put the browser window on my laptop (which is smaller) the design is totally messed up. Do I need to focus on specific widgets and instructions e.g. font px or anything?
in Elementor I see the tablet correct, but on the tablet the images don't have the same size, I have cascading containers like landing page with maximum width
This was very helpful I'm older with bad eyes and sometimes Aviva moves too quickly. She DOES and then when she has done something the tells us: "Let's do it" and I get lost. But, this time I was able to follow along. I strongly recommend going to settings >devices on her computer and making the cursor larger. Also, a webcam pointing at a 15-degree angle to the screen might work so you can point with a pen tip to something you are demonstrating. This was helpful. Combining study with Aviva and Wes McDowell I'm beginning to "get it."///// I want to remind new editors," Don't go crazy for more gimmicks. Times change. People do not. Pictures draw the eye. WORDS SELL. This is advice from the greatest marketers and advertising guys in the world. Therefore, write more and use things like sliders less. You can get started with basic Elementor FREE and there are enough free sample plugins to do most of what you'll want. Buy Pro after you know what you're doing a bit better and are earning some money. Elementor's competitors are very expensive and intended for their own page templates. I think staying with Elementor is your best choice. You can find many FREE site templates instead of the free Hello Theme. The newer Themes/templates are optimized for everything and kept up to date so you'll always be in good shape.
2:44 then why is it when I change the image size on mobile view it change the desktop size as well?
Hi Danna, only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes. Please see this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html
Thank you. Love from India 🇮🇳🇮🇳🇮🇳
Thank you, this was very helpful! But how do we fix things that run off the page (not just wrapping like shown in this tutorial) for tablet and mobile views?
For desktop it's perfect in the editor yet on my widescreen menu and product grids are wrong. Should I still go by the editor?
I appreciate this step-by-step tutorial so much!
Mine is not allowing me to edit my Nav Menu. Please help. this has been stopping me from launching my bog for weeks now. As the the menu is not showing on mobile.
Thanks for the video. Question, the section that says a Find Us On Social Media, how did you get that to align vertically?
Hey Coolest, our tutorial on Social Icons explains this: th-cam.com/video/IB30qs_d7xs/w-d-xo.html. Check it out 😀
i use
Elementor header and footer plugin to create both it works fine easy to use but for responsive in tablet breakpoint the header menu is not show anything. HELP!
I can;t figure out how to align something in the center on mobile. The adjust height to screen option doesn't work for some reason.
How do I make the search widget only appear when the user clicks the search icon?
How do you maintain the same desktop style for multiple desktop resolutions?
activate additional breakpoints in the settings, eg widescreen. or code it yourself via css media queries if its very specific
Hi @Elementor, I have a very similar problem, every time a modify the size of the browser window in desktop mode, the vertical position of the first section elements moves, even if if the windows did not match the tablet or mobile phone size criteria. How can I get it to not change its vertical position regardless of the window size ? (maximized window on screen or smaller window size on screen). Thank you.
Hello. I am unable to select the header. I have PRO and am using Hello theme. Please advise?
Hi Daniel, there could be a few reasons for this. Can you see the orange "Edit Header" handle? If not, you may have the free Hello theme header activated, which can not be selected from the page. Instead, it is edited from the Site Settings.
If you can see the Edit Header handle, but can't select it, open the Navigator (CMD or Control + I) and try hiding the first section/container of your page (hover over the section in the navigator and any eye icon with appear, click it - it only hides it while you work, not from the live page). Try to select the header. If you still can't select it, you can edit your header from the Theme Builder.
If you're still stuck, please contact support from your Elementor account dashboard my.elementor.com or you can post your question in the Elementor community. You can share screenshots and links there as well: facebook.com/groups/Elementors.
I do not have Elementor Pro so there is no Global option. In Customizer the only options are pix now EM option for text.
Hi Jula, the Global styles are available in all versions of Elementor, including free. You can access Global styles from the Elementor Editor: th-cam.com/video/CjdFxKPPikU/w-d-xo.html
Why I don't have Align (5:33) and mobile dropdown in my content settings? also responsive mode - the way you view tablet and mobile here is different from mine, do I have other version or just missing something?
Hi George, thanks for your questions. Some of the responsive features have been updated since this video was published, but the general concepts remain the same. You can see the updates here in this video: th-cam.com/video/i1yTLQ9R-Yw/w-d-xo.html.
@@Elementor Thank you ^^
How do we fine tune tablet horizontal view vs vertical
How to resize products archive in elementor while doing the responsive?, doesnt gave me the option to to this, and cannot find the container main selector to resize that product archive y.y
2:35 critical information that I wish was more apparent! thank you
Can somebody help me about the mobile responsiveness of website. It appears different in other devices. What should I do about it?
Nice, 1 question: When applying a scroll effect in a motion effect, using horizontal scrolling causes the drag to move erratically left and right on mobile. On mobile, it should only have to drag up and down. I want to create an image that disappears left and right through motion effects, is it impossible? There is no problem on the desktop, but on mobile, there are problems when dragging.
Sadly they dont respond to people's questions
I cant see the viewport icon on the alignment, and it's a dropdown menu too, not buttons. Im ussing Version 3.10.1 free ver
Hi Trọng, these kinds of things can be difficult to troubleshoot without screenshots and more information. Have you joined the Elementor Community? It's a great place to ask questions like this, and get solid advice from other web creators. And you can share screenshots and links there as well: facebook.com/groups/Elementors.
I have a question, why when I use "Icon list" It only can be seen on pc devices, not on phone devices?
Hi Leopoldo, these kinds of things can be difficult to troubleshoot without screenshots and more information. Have you joined the Elementor Community? It's a great place to ask questions like this, and get great advice from other web creators. And you can share screenshots and links there as well: forum.elementor.com.
Please, different settings for different devices can you have just with pro version? Not with elementor basic? Because I tried to get responsive for mobile but edit get also in desktop and in the other way around so no different responsive for different devices
Hi Salvatore, thanks for your question. Responsive settings are available in the free version of Elementor, as well. Please check out this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html. Only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes.
@@Elementor thanks a lot for fast reply. Yes I have had something of wrong. Thanks again!
Hello my Tablet break point is 1024px, does anyone know why is 1024px and not 768px (like this video) , and how I can change it?
HELLO... I listened to your video regarding editing Desktop, tablet, and smartphone formats. Your video states that editing the format on a smartphone does not affect formatting on a desktop. This is not what happened. Changing the position of an image in phone mode messed up all my formatting on my tablet and desktop. I'm running Elementor on an Astra theme thats been gutted of any interference. What do you suggest?
Hi Rev, only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes. Please see this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html
@@Elementor sorry, that simply is not true. I'm talking about settings that do have viewport. I'm using guttenberg now and when you make a change on the phone view it does not change anything else.
Hey Rev, these kinds of things can be difficult to troubleshoot without screenshots. Have you joined the Elementor Community? It's a great place to ask questions like this, and get solid advice from other web creators. And you can share screenshots and links there as well: facebook.com/groups/Elementors. If you're an Elementor Pro subscriber, you can also contact support directly from your account dashboard.
Yes, I did. and no it did not help and you have other people here complaining of the same issue
how do i make a specific hyphenate breakpoint for my full width text?
Hello. You say that the computer version modify the tablet and phone version but when I change directly the mobil version it also change the computer version ? Why that ? tutorials on youtube always say "how easy it is " to change differents version but it is a nightmare until now for me. Nobody explain why there are changes on computer version without wanting it.
Hi Jean Claude, thanks for your question and comments. Please check out this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html. Only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes.
When I tried this (changing 20/20/20/20/20) to (33/33/...) the column won't wrap down why does this happen TT
when i change it in any section it does changes as well and effects my desktop view
Hi Shifting, please check out this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html. Only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes.
Doesn't work for me... I change the width column value and nothing happens... still the same... :( I don't get how to fix this...
Hi Laura, these kinds of things can be difficult to troubleshoot without screenshots. Have you joined the Elementor Community? It's a great place to ask questions like this, and get great advice from other web creators. And you can share screenshots and links there as well: forum.elementor.com.
Everytime I edit for mobile phone, it also changes my desktop site. I'm so extremely frustrated with this.
Hi Joanne, settings that do not have viewport icons next to them will apply at every screen size. Only settings with the viewport icon are device specific. See here: th-cam.com/video/EqFxeluk4U4/w-d-xo.html. Let me know if that solves your issue.
exactly same problem i am also facing i made a beautiful website it's looking great in desktop but when we open it in mobile it sucks every icon has a viewport icon but still changes happing on every screen format i don't understand
Excellent presentation.
Thank you it is very helpful elementor
Well explained. Good Job
if i put a picture in a different section on mobile, it changes on desktop?? whats going on
thanks for this! I am looking to make the width of the slider carousel on the background of the hero section narrower. I have done it by adding to the 'additional css' code for width = 70%. I also added right = 0. It made the carousel slider central, but then after fiddling with other stuff, and making the width smaller it wasn't central. On css there is no 'horizontal-alignment : center' so not sure what to do. What do you suggest please? Thank you very much!
I have Elementor PRO, but I cannot edit in my header. Is this because of my Theme use?
Hey mcelia I recommend reaching out to support through your account. They will be able to look into what is happening with your header and help you out.
The best thing you could do is allow for a range of breakpoints to be selected and then it doesn't change until it hits said break point. I don't want my screen scaling indefinitely until it hits that breakpoint, it is obnoxious and goofy AF
very clear explanation, thank you!
I need urgent help, each time I make changes on any of the responsive mode it affects the other
@JamesStrong, please check out this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html. Only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes.
Thank you very much. beautifully explained
no it's not right if am changing any thing in mobile view it gets changed in laptop and tablet also which disoriented the structure of complete website i tried every way i am out of ideas how can i fix this issue
Hi Amit, thanks for your question. Only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes. See this part of the video to review it: th-cam.com/video/EqFxeluk4U4/w-d-xo.html.
Very informative. Thank you.
Thank you , this saved me ✅
Exactly what I needed!
GUYS PLEASE, NEW UPDATE RUINED RESPONSIVE LAYOUT, I CANT STRECH IT DOWN TO SEE WHAT IM EDITING. ITS SO SO BAD :( WHAT CAN I DO?
It's a great template example. What is its name in elementor pro. I am the pro member.
I agree. I'd like to know the name as well.
How to make sure that text is not too small in mobile view
Any idea why after i did mobile edits, my desktop still got totally messed?
Hi Pintor, please check out this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html. Only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes.
It is the suggestion it would wonderful if we can integrate elementor forms directly with Google sheets without plugins
Awesome! Everything I needed. Thanks
Hi there! Please tell me how to drag and drop in mobile ?
I just moved a bunch of stuff for mobile responsiveness and everything changed in my website..............................................
My Elementor dont have this frame that looks like a smartphone or tablet.. does anyone knows how set it ?
Hi Alexandre, I recommend posting your question in the Elementor Community Facebook group. You'll be able to share screenshots and more information about this issue, and get great advice from other web creators: facebook.com/groups/Elementors/permalink/3707554449370314
Oh I wish this were true. I edited a mobile element and went back to the desktop and it had changed and was not expecting that and had to go back into history and fix it. Not sure what to do. Guess I will have to experiment. And right when I thought I was about done.
Hey @nikkilesley2525, only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes. Please see this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html
@@Elementor thank you!
I would be awesome if you folks could make these resource files downloadable so we could all play along.
When I change something on the tablet mode, say move a section because it's positioned wrong and text is bunched up it then moves on the desktop. How do you move and position sections so they aren't all over the place. too long and why does the featured image become too large. I thought Elementor was intelligent when you change modes? Why is this happening? I'm getting frustrated using Elementor. In theory it sounds great but in practice not so much.
Hi CProton69, these kinds of things can be difficult to troubleshoot without screenshots. Have you joined the Elementor Community? It's a great place to ask questions like this, and get solid advice from other web creators. You can share screenshots and links there as well: facebook.com/groups/Elementors.
Hi CProton69, I had the same experience and it does not match the results of this tutorial. When I move an image on smartphone formatting, it messes up the formats going up the chain which this video says it does not. Did you find a solution?
@@rev.lazarus906 No I’ve not been doing any Wordpress work for months. Still don’t actually have a website in any way shape or form.
Great tutorial 😁
Love from Bangladesh, 💝
thanks to elementor for 11:30
..and when I finally reached a chat person at Elementor support, they said they couldn't help me unless I was going to make a purchase.
Hi Joanne, I recommend posting your question in the Elementor Community Facebook group. You'll be able to share screenshots and more information about this issue and get great advice from other web creators: facebook.com/groups/Elementors/permalink/3707554449370314
Thank you!
Amazing like the video from cassie we miss to the videos from cassie sooo short and sooo great
Hello, can you give me the page demo..i want to practise it.
Great Video
tk u i clearly understand
wow well explained
Exactly what i needed
What about basic menus for food? any links? to make a basic food menu>
Whatever happened to ‘Cathy from Elementor’?
i hope you should give demo website or image and content.
The new Loop grid does not active responsivley.
great! subscribed!
Hi SK, we're happy to have you with us :) Stay tuned for even more responsive editing options, coming soon: github.com/elementor/elementor/issues/15797
Thank u❤️
Change Nav Menu to Flyout instead Dropdown. Need a flyout
It’s like guitar hero for musical instruments
This isn't working. You say that larger screen sizes don't inherit the changes made to smaller screen sizes. And yet, every single time I make changes for my websites mobile layout, it also changes the layout for desktop... What you say happens is not actually what IS happening. This doesn't work. And I have found numerous other people online who have been complaining about this same exact flaw, and still there are no good answers or solutions from Elementor.
Hi Black, thanks for your comments. Please check out this part of the video: th-cam.com/video/EqFxeluk4U4/w-d-xo.html. Only settings with viewport icons can be changed for specific sizes. If a setting doesn't have a viewport icon next to it, changes will affect all sizes.
yes, soooooooooooo many users are telling them same problem, but they didn't listen, except copy the same vidoe link which doesn't solve our problem. the truth is, elementor responsive mode DOEN'T WORK! untill 2024.05.23.
you need to update the video
Wow Elementor is NOT intuitive and has slowed my process by triple the time...very buggy as well. Going back to good ol' basics.
GREAT!
Классно получается. Почти как в Тильде))