How To Use The NEW Divi Builder Presets | Divi Feature Update 4.5

hey everyone it's Nelson Miller here with PA creative and the divvy teacher today I'm going to show you the new feature update from elegant themes this is very vision 4.5 of Divi and it brings with it an upgrade to the global default and they're calling this presets or global presets something like that I'm gonna just walk through it and kind of explore it it's kind of gonna be you know kind of my normal slow pace you know there's no upbeat music or anything like that just kind of taking a look at what it can do and a couple of the features maybe a couple quirks and ways around them and things like that all right let's get started and take a look at this update with the presets alright so here we go I have a layout a premade layout from Divi installed here on a demo website and I'm going to try to explain how these presets work and show you some of the quirks and hopefully it'll make sense to you and well it doesn't all make sense to me but hopefully the part that doesn't make sense will make sense to you anyway so right now this is just how they've Stout it so obviously these modules you know whatever modules are on this page have been styled full with header setting it's not default all right so I'm saying that for a reason obviously this is not like when you add a text module it's not styled this way I'll get back to that but basically these new settings are replacing or upgrading whatever you want to call it the global defaults so you used to be able to right-click on anything and there'd be like set as default or you know make style t-phone or whatever edit default styles and all that okay well now the new thing is edit preset or apply styles to active preset things like that because it's presets the new feature is presets so anytime you open any module column row or section settings you will have this new drop-down underneath the title up here okay so right here it just says text default preset and then underneath here we can create new preset from current styles or we can just add a new preset so again under any you know basically any of the Divi elements here so if I'm in a section we get that and you know it affect all the section styles I haven't checked actually a column but I assume yeah so if you're in a column you can do that too so alright so pretty much all of those areas you can do this so what are these presets so it's just a collection of your design settings and they are specific to the module right so if I have a text module and I change the title text the h1 for example and then over in a blurb module I have an h1 or something it's not going to update across the modules and that's that's to be expected that's that's good that's how the global defaults worked let's go and show you actually a good example I'm just looking here what module to use a button module would actually be a good one to start out with so in fact let's make sure I have more than one on the page in fact here it's just a month yeah I didn't know if it was a call to action but yeah I think ok so here's just a button module that's edit this and I'll show you how it will affect the other one now right now again like I said this is just how they've designed it if I would click on modified styles it would bring up all the styles here that have been added you know in the pre-made layout by the team at elegant themes right so you know the black icon color you know everything the font everything like that alright so what I want to do is basically modify this now I'll show you the quirk and I tried to talk with elegant themes about this and I don't really think I could get it across to them um let's just say I have I want to make this a default let's go ahead and look at the settings here it says create new preset from the current styles so right now you know I have the font and the border and all that so if I would make a preset I could go apply that to other buttons and all right now let's really modify this thing so it's obvious so right now I want to go into the button and let's do some stuff like the border radius like let's really make that like high we'll put it like 50 okay now it's rounded okay that's a pretty good one how about we do something obvious here we'll make it red and even the the button text color will make green make it really nasty all right so now if I go up here to this I can say create new preset so we could name it nasty button all right all right so we name that and there it is so and it flips over to this grey and basically that's the kind of like how it was with the default global styles there when you see this grey at the top and this little icon to flip it back over you know you're editing a preset okay when you see the gray you're editing a preset now if you would only see the purple that means you're editing this individual module all right so now let's go up to another button right here and we'll apply that preset all right so and I'm gonna show you the quirk so if we go here remember I called it nasty button so if I click that now it doesn't really do anything I mean it does but I want to point out that the one with the star is the one that's active so if I click that star see what happened there this will assign nasty button as a default button preset across your entire site okay so clicking on this right here in the blue applied it yeah oh it is unapplied it because I clicked the interesting learn something new there but anyway it applied it right the red border but it didn't make it right and I'll show you why but if you click the star that's the one that's like the the global preset all right but just now I applied the nasty button and now you but you're like no wait a minute the nasty button preset down here is red rounded with green text mm-hmm and this is what I've been kind of arguing with Nick and the lad about it doesn't make sense if I'm going in here and applying it why doesn't it apply the reason is because this particular module is set to different settings here look here the border radius is zero and I could hit this right here and then it clears out my manual settings and applies the preset now to me that makes zero sense like that doesn't make sense at all and that's what I've been discussing with that I was like this I don't get it everyone's gonna be confused so one of the things that I there point is that well why would you want to override you can still have manual control over each element and I totally get that my point is that when you're assigning a button it should do what you think like clicking on that should assign it now I just unassigned it but signing it like that should do that now here's the trick that we can do to overcome that we can clear out all of those things if I right click on here click the three dots and now I'm running out of space here on my page okay so we could reset module Styles like that reset module styles did it do it no it didn't let's try it again reset module styles there we go so now it's back to normal and because I reset the styles the preset took over so there you go that's the workaround and this they would fix that but there you go that's the that works and now you can have you know you could go through and like I said if the star if I was clicking this star we get this pop up you know and that's that's kind of what we already did it's you know kind of a stern warning because you're gonna apply that to any button that will not apply if I have like in here this button here is inside of a module so for that to happen I would have to come in and well there's just no way to do it I mean I could come in here to the button Settings button one button too but you know there's really no way to get my button module into here that's what I was saying earlier about how each module is separate so I'm not sure if they have any solutions for that maybe I can reset it here let's see no it just goes back to the normal three pixel border radius so hopefully that they add something to improve that all right let's do something else so this divider line that's a good one right nice and simple so let's say we want let's make a bunch of them let's add a new preset we want to call this divider actually it's call it like green divider alright a weird thing is when I just said new like under here I said the add new preset so here we can go and we're just making a preset what I say green or something we're just making a preset we're not editing the current one and that's what's a little bit odd but it kind of makes sense so if I go here and add a divider I mean just you know add a module and say I want to add a divider alright and then I could come in here go to the preset and say I want the green divider and it's just green now if I wanted to make a preset based on the settings here then I would use this other one create new preset from current styles so here we'll say red divider right and then the gray you know global default settings come up for that red one and I could even come in here and let's say well let's make the let's make it thicker make it obvious something like that okay yes I'm sure I want to change that and all that now if I wanted to change this one to the preset I would come up here click red divider and it updates now what if I want to update these red dividers and I don't want them to be so thick but I've went and put them all over my website here's the use case so you would come in here open one of the dividers up go down here and then on red divider you click this edit button and then it will open up that gray panel again and I could come in here to sizing and let's say I want them to be you know just thinner but maybe I want them to be wider and they update across my website so there you go that's the beauty of this there's also a couple of other settings in there that are new in fact there's one icon that's brand new when you hover over this one right here kind of I'm not sure like a u-turn type of arrow here it says update preset with current styles and what that means is if I would go in here and I would just happen to be changing this one the blue right then I could go in here and I could I could go to this red divider go to the u-turn and say I want to update that to the current style well the current style is this blue so I'd hit yes and it updates everywhere cost my site and then other than that everything in here is pretty standard here you have the preset settings so I could have signed this one to be default okay yes sure I don't even know which one did I just sign it to the green 100 so yeah I assigned it to the green one so if I go to the settings here I could assign it to this one red divider I want the red ones a beautiful which is blue now but I we called it red so that's a good use case let's rename this so you go to the settings now I say blue now it's a blue divider okay and then the other things are pretty similar to what we're used to do kay delete and then edit of course so there you go that's kind of a walk through your you're going to be using this all the time or you should be anytime you're making a website you should try to be consistent let's say we want all of our images on our site to have rounded corners so let's go here to border and we add you know whatever 10 pixel border rounded now we've just added that we've just edited just the image the default preset so it's not gonna affect any other image on our site unless we hit this u-turn right this will affect all image modules using the deep image default preset so even if you don't make presets you can edit these defaults okay so there we go now that's good look at some of my other images there you can see one then the hair you can see all the other ones down here so all the images have my rounded corner because they're all automatically set to the default preset so that's pretty awesome and again I used just used what did I call it the u-turn symbol to do that so that's pretty cool I'm happy with this if you want to you know literally do anything you'll just have to go into one of the modules like that and I think the confusing part with this was like I said the whole idea of where I'm editing something and then it doesn't apply to that one when I make it a global default like I showed you with the dividers and then maybe the other thing is how you have to one of the other things that was confusing is when you're in any module and you have this add new preset button how you you're making the preset but not actually looking at it that's confusing and then the alternative is just to edit the default you don't like I said you don't need to make any presets you can just go here and keep the one that's there go ahead and you know make your changes go into the flipped around gray area make all your changes to things now things like that you would want to change would be things like the text size here for example you'd want that always the same now obviously you can't change the content because it would say the same thing over and over and every module so you don't have to change that and individual ones like that so okay and that's a look at the new divvy feature update with the presets really nice feature especially like how you can just you know apply them across your whole site it you know it doesn't have to be just on the page it's not like the extend styles where you had to do it kind of on the page or section but yeah I think these presets you know once we really get used to doing it you know a daily base is going in there and I think it's gonna become second nature and you're gonna just we're gonna be like how did we live without this so anyway if you like this video give me a thumbs up and be subscribed here and check out all the other videos we have and we'll see you in the next video [Music]

Channel: Pee-Aye Creative

Views: 2,327

Keywords: Divi feature update, new Divi feature, Divi 4.5, Divi presets, Divi presets feature, how to use the Divi presets, How to use Divi presets, how to use the new Divi presets, Divi module presets, Divi update, New Divi feature Presets, Pee-Aye Creative, Divi, Divi Theme, Divi Builder, Divi Builder Presets, Best Divi features

Id: _bi8h_YM9AY

Length: 16min 38sec (998 seconds)

Published: Fri Jul 10 2020