Just what I was looking for. I've had Elementor for at least 5 years and am ready to completed rebuild my websites. I have not kept up with all the new stuff. Thanks
I'll have to use some of these tips! A couple of mine are adding some CSS code to the theme: REMOVE UNWANTED SPACE FROM THE BOTTOM OF THE TEXT EDITOR: .elementor-widget-text-editor p:last-child{ margin-bottom:0px;} STOP OVERFLOW (ENTIRE SITE): html, body{ width:100%; overflow-x:hidden; }
Hi Jeff, this video is GREAT! Is there any chance you can release a new version of the video with the new options that have appeared in the latest version of Elementor Pro? This is a great video and I think it's a great starting point and foundation for anyone starting out with building a website.
Hi Jeff, this was really helpful and I appreciate the way you teach! I have a question: Referring to this video and your other video “How to Create a Wordpress Website for Beginners with Elementor in 2022: Mini Course”… Would you reccommend combining these two resources as one big step-by-step guide? Or do you plan to make another updated Mini Course video due to the Elementor updates? I noticed in the other video, at that time in 2022 using Google Fonts (Montserrat) was accepted, but in 2023, you have to turn off this feature. This just makes me wonder what major or minor steps need to be modified in the creation process now!
Great tips! Took me a minute, but if you didn't set containers to "active" then you won't have the options to set container padding to 0 in the Site Settings. Just a tip for anyone who was wondering why they don't see those settings. 👍🏼
Yes! I’ve seen many ask why they don’t have containers. I’m glad you pointed that out. Now they’re a release candidate, I think they’ll be active by default in an update soon. Probably not by we’re getting the containers pop up in the 3.12 update
Awesome. Just what I needed to get away from some bad habits in my setup. Thanks. Would love more setup tips…like clarification between using theme or page builder settings…which leads the design process?
Thanks and great question. Since Elementor has a solid global design system, I apply my design system within Elementor (the page builder). The only time I would let the theme control the layout and design styles are for WooCommerce sites where I’m using a theme better suited for product pages like Blocksy or Ray. Everything else is all in the page builder.
@@LytboxStudio Interesting. Thanks for the clarity. I’ve always been confused by this choice. I’ll stick to Elementor except for ecommerce sites. Appreciate the quick reply.
@@dinopelle it does get confusing with so many options to do the same thing. I find using Hello theme helps because there’s no theme options, just the builder. It’s the same for Bricks, BD, and Oxy, none of them need a theme and is all done in the builder. I feel what’s most important in the design and build process is finding what works best for you and master that process. Then you’ll be able to refine it.
I like your presentation - but wished that you explain what it really does. For example "inline font icons" (based on the text I am not sure whats about). For a beginner is this to fast.
What a great video, very helpful! On single product page, updated Elementor disable the entire products information(image,price,add to cart, etc..), unless edit product only with Wordpress. Have you or anyone facing same product ?
Thank you so much for the tips!! I disabled the tag generator but checking the page through an additional extension in google chrome still shows how the page is done..Could you prepare something about the new AI feature in Elementor? I am also interested in using Slider Revolution, just wondering if it is compatible with elementor and if it will put too much load on the site?
Hey, slider revolution is a speed killer. I used to use it and then as soon as I decided to get rid of it, my pages started rising in speed. There is so much bloat in this thing.
Absolutely! That navigator gets filled up quickly and can start to get cluttered especially with inner containers. I like to label my outer containers based on their sections so they’re easy to recognize
Great tips, would love to see more setup options discussed..... Like... Settings > General > "Cache Levels." What is the difference in cache level settings (0, 1,2,3)? If you already have a caching plugin, should this be set to zero?
Hey thanks Frank! I think the cache levels may be from a caching plugin. Are you already using one? To be safe and prevent issues I only stick with 1 caching plugin for site caching (I use WP Rocket) and I also use Varnish for server caching. It comes with Cloudways. If you have 2 plugins that can cache, I would only use 1
@@LytboxStudio THANKS... I just needed a gentle push in the right direction. You were correct. It was a caching addition from HostGator (Endurance Cache). I went into the main Plugins page > "Must Use" section and removed it. Thank you!
What to do if you have an old website like 5 years old and you need to make a new version? My current provider sadly doesnt provide staging. I feel a little bit overwelmed :(
Turing off the features/experiments that aren’t being used helps the performance. It’s not a drastic change in GPS but every bit of optimization works.
Maybe if we are don't have Elementor pro to add a custom font to use it inside Elementor when build page how we will do it after block google font to load 😊
You can use a free plugin by Brainstorm (the guys that build Astra theme and various good plugins) called custom fonts. It's free, it works great and even a couple of years ago, when elementor would mess up my fonts for some reason - they din't load properly or caused too much cumulative layout shift - I just used this plugin, very successfully I might add. Now elementor pro offers variable font support, so it might be worth paying for it, (this plugin doesn't offer variable font support), but I haven't tried elementor variable fonts yet.
The navigator needs to be able to name elements. when a page gets big finding the right "container" in a sea of containers in the navigator is impossible. Admin labels would be sweet
Good question. Google is collecting data when loading their fonts externally. That one for sure is a no no. And Adobe fonts is iffy. Both are not good for performance as well. Best to install your fonts
Are you using the Pro version of Elementor? Keep in mind the 'Features' section in the dashboard often changes. Sometimes the features become automatically applied.
Right, it just throws off the layout consistency. I’m guessing it’s to help people see the different containers when using inner containers. But that UI comes at too high a price I think
There is an explanation of why these padding use 10px by default. This is part of the concept of responsive design and is called Gutters. Gutters are the padding between your columns, used to responsively space and align content in the Bootstrap grid system. Knowing that all columns have 10px of padding-left and right, if you sum 12 columns with a width of 75px + 11 gutters (space between the columns) of 20px (because the columns have 10px of padding-left and rigth) + the 10px of the padding left at the beginning and the 10px of the padding right at the end, you will have the 1140px of content width that Elementor uses by default following the design responsive concept. (12*75px+11*20px+10px+10px = 1140px) >>> Every UX Designer should know this and the Elementor follow these concepts.
@@cmoik The key aspect I don't understand is te use of px in such circumstance. UI hardly touches px and it has very little to do with the flow of UX. Any UX/UI designer knows this.
⚠ I recommend not deactivating the options that are marked with the blue box labeled 'Performance' as they are options that Elementor created to improve performance, making the page faster.
Bruh... your cinematography, colors, resolution and lighting is on point.
Definitely glad I came across your channel. Already a big help.
I'm so glad to hear!
Just what I was looking for. I've had Elementor for at least 5 years and am ready to completed rebuild my websites. I have not kept up with all the new stuff. Thanks
So glad to hear! Elementor evolves so quickly, there are several more new features I’m looking forward to exploring and sharing.
@@LytboxStudio Fantastic. I've got your notifications turned on. You have an excellent teaching ability which is greatly appreciated.
@@thomasconrad2729 that is so awesome to hear! Many thanks!
I'll have to use some of these tips!
A couple of mine are adding some CSS code to the theme:
REMOVE UNWANTED SPACE FROM THE BOTTOM OF THE TEXT EDITOR:
.elementor-widget-text-editor p:last-child{ margin-bottom:0px;}
STOP OVERFLOW (ENTIRE SITE):
html,
body{
width:100%;
overflow-x:hidden;
}
Nice one! That overflow is a must! Especially for mobile
Hi Jeff, this video is GREAT! Is there any chance you can release a new version of the video with the new options that have appeared in the latest version of Elementor Pro? This is a great video and I think it's a great starting point and foundation for anyone starting out with building a website.
Hi Jeff, this was really helpful and I appreciate the way you teach!
I have a question: Referring to this video and your other video “How to Create a Wordpress Website for Beginners with Elementor in 2022: Mini Course”… Would you reccommend combining these two resources as one big step-by-step guide?
Or do you plan to make another updated Mini Course video due to the Elementor updates?
I noticed in the other video, at that time in 2022 using Google Fonts (Montserrat) was accepted, but in 2023, you have to turn off this feature. This just makes me wonder what major or minor steps need to be modified in the creation process now!
great tips
Great tips! Took me a minute, but if you didn't set containers to "active" then you won't have the options to set container padding to 0 in the Site Settings. Just a tip for anyone who was wondering why they don't see those settings. 👍🏼
Yes! I’ve seen many ask why they don’t have containers. I’m glad you pointed that out.
Now they’re a release candidate, I think they’ll be active by default in an update soon. Probably not by we’re getting the containers pop up in the 3.12 update
Just created a whole container website without knowing about this new feature.🥲
Great tip, looking forward to the font video
Thanks and sounds good!
Thank you very very very Much for this Tutorial xx
Insightful as always!
Thanks mate!
How did you get the outline of the containers with the plus sign in the middle?
Very informative video Thanks!😄
Thanks for sharing. I am new here and wish to learn from you.
These are great tips! Awesome content
This is so useful thank you
So glad to hear!
I caught the value. So much value as always
I’m so happy to hear this thanks! 🙏
Great job as always Jeffrey!
Thanks!🙏❤️
Awesome. Just what I needed to get away from some bad habits in my setup. Thanks. Would love more setup tips…like clarification between using theme or page builder settings…which leads the design process?
Thanks and great question. Since Elementor has a solid global design system, I apply my design system within Elementor (the page builder). The only time I would let the theme control the layout and design styles are for WooCommerce sites where I’m using a theme better suited for product pages like Blocksy or Ray. Everything else is all in the page builder.
@@LytboxStudio Interesting. Thanks for the clarity. I’ve always been confused by this choice. I’ll stick to Elementor except for ecommerce sites. Appreciate the quick reply.
@@dinopelle it does get confusing with so many options to do the same thing. I find using Hello theme helps because there’s no theme options, just the builder. It’s the same for Bricks, BD, and Oxy, none of them need a theme and is all done in the builder.
I feel what’s most important in the design and build process is finding what works best for you and master that process. Then you’ll be able to refine it.
@@LytboxStudio excellent advice. Much appreciated!
Nice video, very helpful. Keep them coming.
Thanks, will do!
I like your presentation - but wished that you explain what it really does. For example "inline font icons" (based on the text I am not sure whats about). For a beginner is this to fast.
I understand. I try and simplify as much as I can. Keep asking questions when you run across thing you don’t understand:)
What a great video, very helpful!
On single product page, updated Elementor disable the entire products information(image,price,add to cart, etc..), unless edit product only with Wordpress.
Have you or anyone facing same product ?
So many great tips. Thanks for this video. New subscriber now.
I am really interested to see how you can reduce the size of fonts. Nice tips by the way. Thank you
It’s coming up next week!
Great how to remove default padding of section??
Thank you so much for the tips!! I disabled the tag generator but checking the page through an additional extension in google chrome still shows how the page is done..Could you prepare something about the new AI feature in Elementor? I am also interested in using Slider Revolution, just wondering if it is compatible with elementor and if it will put too much load on the site?
Hey, slider revolution is a speed killer. I used to use it and then as soon as I decided to get rid of it, my pages started rising in speed. There is so much bloat in this thing.
Great video man. Can't wait for that font video! New subscriber in the building ;)
Awesome!✌️Happy to have you hear!
Awesome tips as always Jeff! Do you ever find it useful to name your sections or elements in the navigator pane?
Absolutely! That navigator gets filled up quickly and can start to get cluttered especially with inner containers. I like to label my outer containers based on their sections so they’re easy to recognize
@@LytboxStudio good call! Gonna start utilizing the nav pane more, you definitely showed how useful it can be
@@soc1a once getting used to it things go so much smoother!
disable google font is the best for gdpr, thanks for the tip
For sure!
Great tips.
Thanks!
Awesome video Jeff! Keep those optimization videos coming :D
For sure! 💪
Great tips, would love to see more setup options discussed..... Like... Settings > General > "Cache Levels." What is the difference in cache level settings (0, 1,2,3)? If you already have a caching plugin, should this be set to zero?
Hey thanks Frank! I think the cache levels may be from a caching plugin. Are you already using one?
To be safe and prevent issues I only stick with 1 caching plugin for site caching (I use WP Rocket) and I also use Varnish for server caching. It comes with Cloudways. If you have 2 plugins that can cache, I would only use 1
@@LytboxStudio THANKS... I just needed a gentle push in the right direction. You were correct. It was a caching addition from HostGator (Endurance Cache). I went into the main Plugins page > "Must Use" section and removed it. Thank you!
Any particular reason when I go to PAGES instead of Edit with elementor I am seeing Edit with Pagelayer??
What theme are you using? This sounds like it’s coming from a theme or plugin. Try using the Hello Theme and deactivating all plugins except Elementor
What to do if you have an old website like 5 years old and you need to make a new version? My current provider sadly doesnt provide staging. I feel a little bit overwelmed :(
You can build on a local host. I use Local by Flywheel. It’s free and easy to set up. I have a video on this about 3 months ago
great video
Doing those changes affect the performance in google speed test?
Turing off the features/experiments that aren’t being used helps the performance. It’s not a drastic change in GPS but every bit of optimization works.
*SUPER* 👍👍👍👍👍👍👍👍👍👍
Thanks! 🙏🙏🙏💪💪💪😎
Maybe if we are don't have Elementor pro to add a custom font to use it inside Elementor when build page how we will do it after block google font to load 😊
You gotta do it the old school way uploading your font files and using @font-face 😉
@@LytboxStudio It will show inside the Elementor ui?
You can use a free plugin by Brainstorm (the guys that build Astra theme and various good plugins) called custom fonts. It's free, it works great and even a couple of years ago, when elementor would mess up my fonts for some reason - they din't load properly or caused too much cumulative layout shift - I just used this plugin, very successfully I might add. Now elementor pro offers variable font support, so it might be worth paying for it, (this plugin doesn't offer variable font support), but I haven't tried elementor variable fonts yet.
The navigator needs to be able to name elements. when a page gets big finding the right "container" in a sea of containers in the navigator is impossible. Admin labels would be sweet
double click them in the navigator and rename them - as far as I know, always been able to rename things in there :)
For sure and we can by double clicking the name. It get’s messy quickly without naming them
Generator option does not remove all wordpress 6.2 in html code -- only 1 out of 2.
Always like your content and presntation!
(not a reply) Just want to add that the generator option seems to hide the elementor version only.
Google fonts is not gdpr compliant, Adobe fonts also not gdpr compliant? Why ?
Good question. Google is collecting data when loading their fonts externally. That one for sure is a no no. And Adobe fonts is iffy. Both are not good for performance as well. Best to install your fonts
What's the advantage of others not seeing your WP version?
It’s good for security preventing hackers from seeing what version of WP you’re using
@@LytboxStudio Thought so, thanks! :)
❤
I have none of those choices. It's just gone. What going on?
Are you using the Pro version of Elementor? Keep in mind the 'Features' section in the dashboard often changes. Sometimes the features become automatically applied.
@@LytboxStudio Not pro.
@@audunjemtland8287 that's why. The free version barely has anything in it, it's why I only use the pro version.
Tip No.3. - I have never understood any reason to have a default padding of 10px. I flagged this up years ago.
Right, it just throws off the layout consistency. I’m guessing it’s to help people see the different containers when using inner containers. But that UI comes at too high a price I think
There is an explanation of why these padding use 10px by default. This is part of the concept of responsive design and is called Gutters. Gutters are the padding between your columns, used to responsively space and align content in the Bootstrap grid system. Knowing that all columns have 10px of padding-left and right, if you sum 12 columns with a width of 75px + 11 gutters (space between the columns) of 20px (because the columns have 10px of padding-left and rigth) + the 10px of the padding left at the beginning and the 10px of the padding right at the end, you will have the 1140px of content width that Elementor uses by default following the design responsive concept. (12*75px+11*20px+10px+10px = 1140px) >>> Every UX Designer should know this and the Elementor follow these concepts.
@@cmoik The key aspect I don't understand is te use of px in such circumstance. UI hardly touches px and it has very little to do with the flow of UX. Any UX/UI designer knows this.
@@rg-web-design Because Bootstrap was conceived that way, and until today, no one has opposed it.
⚠ I recommend not deactivating the options that are marked with the blue box labeled 'Performance' as they are options that Elementor created to improve performance, making the page faster.
Ждём про установку своих шрифтов :)
Another good tip is to use good hosting 😂
That is a must!
Elemntor is expensive and cant find even boxed layout!! Waste of money and time
So what do you use instead? FYI you can get it super cheap thanks to GPL licensing - I got it from Worldpress IT
@@barrygrottis4578 divi unlimited license 👍