Learning Divi: The Fullwidth slider module

hi today i want to talk to you about a module in the divi which is called the full width slider module i've been using it in several of my latest projects like in this one and you can see there's different slides here and you've got a title and a button for a call to action and let me show you another sample this one there you go there are different images now i want to show you how to create one of these um so that you can add it to your to your project now there are two similar modules there's a full width um header module which is similar except it doesn't have slides on it it's just one image fixed in there with the call to action and the the title and then there's the full with slider module which will be the one that we're going to be using now let's create a page here let's click use divi builder click it again that's built from scratch and here you see it doesn't give you the option for a special full width row so let's just add this and then remove that and then let's add a new section and there you will see the full width option let's click on that and you'll see that there are fewer modules available to this i wish to add a few more um but well they have these and here's the full width header that i talked to you about and here's the full width slider and there's also a post slider as well let's use the full width slider now and you will see that it's come with two slides already set up let's remove this area that we added here and as you can see it's also it's already a large area before you you add the um the slides to it um in order to add a background to the slide let's go edit a specific slide here's the content and you would want to add the background here let's add a background image let's add this one there we go and let's go back to the other slide and change the background as well now you can add a little overlay if these images are too bright let's um save this and let's exit the visual builder so that we can see it here's the one this one's okay but the next one is a little too bright so we could add our overlay to that let's uh enable the visual builder and edit the specific slide now you have to remember that these slides are independent of each other so if you make changes to your first slide you might have to copy the item styles and paste them over to the next one if you want them to be identical for now we just want to edit this one and let's see what it looks like with an overlay let's see look it looks much better with the background overlay the text overlay i imagine it would just take the tesla to see what that looks like just for the text that would work on certain designs but i prefer the background overlay that looks much better and immediately you can just save that and in order to edit some of the other parts uh if you know what this the design tab is the most useful tab in divi where you manage everything from the the title to the button to sizing between elements and you can do all of that to the design tab and you can copy your duplicate your slides in order to manage them more easily but as you can see you get something great looking with just a few clicks and just adding a good image i used a thousand pixel image optimized for wordpress and compressed in jpeg and that's that was pretty it was like 123 kilo kilobytes so that's good and uh you can change the fonts however you want with the color and the google fonts that divi comes with and that will help you customize your full width slider module i hope this video has helped and you test out all the full width section [Music] modules that there are so that you can change the look of your site and make sites that pop and that are wonderful to look at

Channel: Sol Barrera Watters

Views: 604

Keywords: Divi Theme, Divi, WordPress, Fullwidth slider module, Divi modules

Id: RAulrzIJ0f0

Length: 6min 13sec (373 seconds)

Published: Sun May 09 2021