5 Ways To Use Elementor Faster, Speed Up Workflows, & Have More Consistent Website Designs

In this article to share with you five tips to help you build Elementor base websites faster and have the designs be more consistent my name is Adam from BharatXNews.com were I make WordPress Articles for non-techies if you enjoy the content in this Article

consider clicking on the subscribe button and if you like Article notifications click on the little bell off to the right and the YouTube will send you an email when I upload a new Article this Article is all about Elementor and some of the tricks and that I have compiled as I have used it to have faster build the website designs faster

and have them be more consistent so let’s just stop right into its number one use hotkeys a lot of people might not be aware but Elementor has hotkeys these are keyboard shortcuts that you could tap to do some things faster like save a page or to preview a page or two undo that would undo the last thing that you did or redo these are all shortcuts that Elementor gives you you can just enable them on your keyboard so a perfect example for me a lot of times

I want to preview my design so all I have to do is hit the command button and P command P and it’s going to put it in preview mode if you’re using a PC it would be control P so this is what it’s gonna look like there it is I just tapped it and there I just tapped it again and it on did if I want to save this where I’m at I can just hit command S and it’s gonna save and these are all with these hotkeys or keyboard shortcuts to number two is to load your colors into the color palette of Elementor

it’s very simple to do this click on the hamburger icon here in the top left and go right here to where it is color picker now these are the default colors that come in the color picker but you can click on any of them and change it to a color that you’re going to consistently use on your website so far I’m not never in his this blue

I might as well click on it and put my color code in for the color that I am going to use and say this is what it was and I could just go like that and now I have that new color so when I apply this now when I click on any element in Elementor where I have an option to choose a color it’s going to show me that color

I just entered as an option so I five clicked on text and I went to style and right here chose text color if I click here you can see there is that new color that I added to the color picker and Elementor gives you eight different colors lots that you could put your colors in that you’re going to use is going to be a huge speed boost and is also going to increase the consistency of the colors that you’ reusing in your design

and you just toss in your color codes and you are off to the races my third tip is a tip that I use all the time and that is creating a safe save section in Elementor with design assets that you’re going to use over and over again let me demonstrate this for you

so if I go to Elementor and I go to my library I would create a new library item by clicking add new in nominating this design asset once I’ve done that a minute click on publish and then I’m in a click edit with Elementor it’s going to pop me into Elementorfirst thing I like to do is put this in Canvas mode so that will remove the header and the footer of the page so I have a completely blank slate to do that click on that hamburger icon again go to page settings and then right here it says template change it from people default to Elementor canvas and now we just have the canvas here so now what I like to do is I like to put headings buttons everything styled the way

I want them so when I go to create a new page and Elementor were I’m going to use some headings and use the buttons and whatever design elements that I throw here for my design asset page I will just restore this section on that page and then reuse those elements let me demonstrate it so say I, of course, somebody use a button on multiple pages

so I would just drag and drop a button in there and I would click on that button and then I would start styling its Jos\’e9 wanted to center edits and I wanted to change some of the colors so for the background color lets use that new color that I just add to the color picker that’s pretty cool and say this is how I want my buttons to look now when I noticed a lot of the time that

I spent in designing a page is in all those little settings on an element that will make it exactly how I wanted the problem comes in if I want to go on a different page and I want to create that element again inputting all those little settings in and making sure they all match with the prior element that I created and so this is where this design consistency comes in so there

I have that and so say I also want to throw in a headline so I have a consistent headline instead of this I would probably center edits and may be changed to some various things like maybe be add some text that shadow to it an accident looks ugly but just say I want to do that so I would build up this design asset library let me go ahead and click on save okay obviously

I have a whole heck of a lot more than these two but that’s okay him to get out of here and I want to go back to my WordPress dashboard so now say I am creating a new page on my website I would just go ahead and click add new I’ll give this a name okay services page I’ll go ahead and click on publish the number to click on edit with Elementor it’s gonna pop up so instead of starting with a complaint a completely blank slate instead what

I want to do is I’m going to click on the little folder here or you can click on add template go ahead and click on add template I’ll click on my templates and we can see design assets so now I can go ahead click on insert and it’s going to put those in there so I can start building my page with all of these design assets

already created and I would probably just maybe want to change the text of the button and I would probably just change the text of the headline as well and I’ve saved so much time from having to re-create the style of these elements on these pages now tip number four is an even better way to do this

if you have Elementor Pro so far everything I’ve shown you is in the free version of Elementor which I think they’re incredibly generous to give the library feature in the free version of Elementor so I got Elementor pro in here let me just go ahead and activate it and now what I’m in a dues

I want to go back into a page I’llgo back into that services page and click on edit with Elementor so now I have the Pro version enabled and it gives me some speed features these features are to make things go a lot quicker and the main thing is a having global elements and let me show you what that is so said here is my button and I want to now save this as a global button I style that exactly

how I wanted so all you need to do is go off to the right where we have this little cursor here and there’s going to be a save icon there that says save widget this wasn’t there unless you had the Pro version on and enabled so now I will give this a name and I’ll call it my default button I’ll go ahead and click on save and

now I have saved the global widget so now when I go to any page in Elementor I have this new option here that says global and I can see I have my default button that it saved element that is already been designed and styled exactly how I wanted I have it right there is a global widget and so all I need to do on any page I can drag and drop it in there it is now here’s the thing this is going to be linked it’s a now a global widget which means

if I change it here it’s going to change here this is a huge timesaver but there might be times where he might want to change the link and keep the style you might want to change the text but keep the style all you have to do is click on this on the link option like this and then confirm by clicking on the link and now they will not be linked together but you saw was just a faster and easier way

then this design asset way to be able to save time without having to restyle everything all over again this is a huge huge timesaver the last tip is more of an advanced tip because it involves custom CSS know whether you’re using the free version of the Pro version of Elementor this feature is in all of them in every module every element there’s some debate whether they should be called modules elements or widgets

I use all three terms interchangeably so in every single one when you click on it you go to the settings and click on the advanced tab and scroll down there’s an option to assign a CSS class so essentially CSS is how you style things with websites so you could write some custom CSS for how you want this button to be styled and you can save that in one location in your teams CSS to file your style.

CSS file and then come in here and just add your CSS class to it then what happens is it will inherit the style that you defined in that CSS that you wrote what’s really nice about this is if you can have to say 50 buttons on your website you only need to go to that one little bit of custom CSS maker change they are in it automatically will change on

all of your buttons that are really the biggest pro tip but it’s a lot more advanced because number one you have to write custom CSS number two you have to know where to put it but if you can write it you probably know where to put it and then all you need to do on these different widgets that you’re using an Elementorthere

I go using a different term all you have to do is add the CSS class in there and it’s going to inherit that style that you defined in one location ultimately that the best and smartest way to style some things but I know for me

I try to use as little custom code as possible and that’s my preference and that’s one of the benefits of Elementorthat’s why this is the last tip and it’s the advanced tip if you enjoyed these tips and want to learn more about Elementor I have a training course called Elementor essentials it’s right here on my website because the course is $150 however

if you don’t own ElementorPro and were thinking of purchasing it if you purchase it through the link in this Article and head on over there I will give you access to this element or essentials course for free got lesson after lesson after the lesson

I had to re-update everything after Elementor 1.5was released because the interface change so it’s all current and ready for you and us happy to have you in the course if you don’t have Elementor Pro already or you can purchase a course is only hundred and $49 KI want to hear what tips you have for Elementorto speed up your workflow if you have tips that

I didn’t include in this article and would like to share I would really appreciate if you leave that information a comment down below hey I gotta tell you people read these comments and I really appreciate it when you take the time to add a comment with some input into this article and I want to hear your speed tips hate thank you for watching this Article and I’ll see you in the next one

Leave a Comment