5 Interesting Ways to Style Divi’s Slider Module

The Divi Daily is a new daily series of Divi tutorials and resources from Elegant Themes and we kickstart what is going to be a hugely valuable set of Divi resources with a 5 part mini series by Leslie Bernal dedicated to customising the Divi slider module. So check out these tutorials and get the most out of your Divi slider module. Links to the Elegant Themes website contain affiliate tracking code. You will never be charged any extra if you use these links and by doing so you help keep Divi Theme Examples a forever free resource.

Part 1: How to Style Divi’s Slider Module for a Bold Team Members Area

In today’s slider tutorial we will be creating a slider used to feature team members. Traditionally team members have a “card” style look or are placed one per column.

divi theme slider tutorials

Part 2: How to Add Parallax Elements and a Slide-Down Transition to the Divi Slider Module

In today’s slider tutorial we’re going to change the slider animation so that the text and button slide down from the top. We’ll also be styling it using parallax settings so the transparent images we’re using appear to “float” above the background.

divi theme slider tutorials

Part 3: How to Add a “Soft Box” Shadow to Your Divi Slider Module

In today’s slider tutorial we’re going to change the slider animation to slide in from the right. We’ll also be styling a sleek slider box with a soft box shadow. This design is subtle but elegant and can easily be tweaked to fit just about any kind of website.

divi theme slider tutorials

Part 4: How to Style the Divi Slider with a Static Description Text

In today’s slider tutorial instead of changing out the animation name on the slide description I’m actually going to be removing it altogether, and I’ll explain why below. I’m also bringing in a few gradients, ’cause who doesn’t love a gradient? Aaaand I’ll show you how to have three buttons instead of two (or as many as you want).

divi theme slider tutorials

Part 5: How to Create a Navigation Mosaic with the Divi Slider Module

The slider is probably one of the more popular design elements seen in websites today and has been for some time. Most people probably think of hero sliders or gallery sliders as two of the most common uses for them, but really they can be used for all kinds of applications — for CTA areas, to display team members, to use for testimonials, or even as navigation as I’ll show you today.

divi theme slider tutorials

Pin It on Pinterest

By continuing to use the site, you agree to the use of cookies. more information

The cookie settings on this website are set to "allow cookies" to give you the best browsing experience possible. If you continue to use this website without changing your cookie settings or you click "Accept" below then you are consenting to this.