Divi Plugin Highlight: Divi Carousel Module

Posted on January 22, 2023 by 5 Comments

Divi Plugin Highlight: Divi Carousel Module
Blog / Divi Resources / Divi Plugin Highlight: Divi Carousel Module

Divi Carousel Module is a third-party module for Divi that creates interesting carousels. They’re great for images, products, testimonials, team members, and more. The module includes lots of design elements that make it stand out. Fortunately, it’s not difficult to use. In this post, we’ll look at Divi Carousel Module, see what it can do, and see how easy it is to use to help you decide if this is the right product for your needs. The Divi Architect Layout Pack will be the backdrop of our tutorial.

New Divi Carousel Module

Divi Carousel Module adds a new module to the Divi Builder. Add the module to any Divi layout the same way as any Divi Module.

New Divi Carousel Module

Divi Carousel Module Slides

Each slide in the Divi Carousel Module displays slides as submodules that are added within the main module. The slides can be styled independently, or they can use the main module’s styling. To add a new slide, click Add New Item.

Divi Carousel Module Slides

Add as many as you want. You can set the number the carousel will display on the screen for each device type in the module’s settings, so the number you add won’t affect the design. The submodules include all the standard Divi settings and a few unique settings. Here’s a look at the unique settings for the submodule.

Main Content

When you add a slide, it opens to show the settings. The main content area includes the title, subtitle, and body content. Use any or all of this content you want. You can style these elements individually in the Design tab.

Divi Carousel Module Slides

Title & Image Link

Add the URL and choose if it opens in a new window. This link applies to both the title and image, so it still works even if you only use one of the two elements.

Divi Carousel Module Slides

Button Settings

This adds a button to the slide. Add the text, the URL, and choose how it opens. You can style the button in the Design tab.

Divi Carousel Module Slides

Image Settings

Here, you can choose to use an image or an icon. An image is the default setting. It includes the image picker, alt text, and if it opens in a lightbox. The image is placed above the title by default, but you can easily change this if you want.

Divi Carousel Module Slides

Selecting Use Icon provides an icon selector. The icon replaces the image. It can also be styled in the Design settings.

Divi Carousel Module Slides

Meta

This includes two options you can select between. You can only choose one of the two options. The first option is Use Social Media. Enabling this opens the fields to enter your URLs for four social media networks and your email address.

Carousel Meta: Use Social Media Icons

The second option is Use Rating. This opens a dropdown box where you can choose a rating from one to five. It displays the rating as stars.

Carousel Meta: Use Ratings

Submodule Design Settings

The submodule’s Design settings include the image styles, image filter, and styles for the title, subtitle, content, button, social media, and rating. If you’ve selected an icon in place of the image, you’ll see icon settings to change its color, add a circle, change its size, and adjust its alignment. In the example below, I moved the image to the center of the slide by selecting Inside Content in the Image Position dropdown box.

Images Styling with Image Position Settings

Main Module Settings

The main module settings include the slider details as well as the standard Divi settings. Let’s look closer at the slider’s settings.

Main Module Settings

Slider Settings

The slider settings include width control, the number of slides to show on each of the device types, multislide, duration, loop, autoplay, arrow and dot navigation, spacing, lazy loading, hash navigation, and lots more. It’s interesting to see the number of items for different devices. One point about the number, you enter into these fields is they don’t have to be whole numbers. You can show a half slide if you want. Just enter the number as a decimal and experiment until the slides display the way you want.

Slider Settings

This example shows that I’ve added some arrow navigation. I also changed the way the individual carousel items appear on desktop, tablet, and mobile. In addition to the above, I’ve also added a loop feature to the module.

An example of slider settings

Advanced Slider Settings

The advanced settings let you choose the slider effect. Choose between Default and Coverflow. The default setting displays the slides as normal with each card facing the user.

Advanced Slider Settings Default

Coverflow displays the cards tilted in 3D. Choosing Coverflow adds Rotate, which adjusts the amount each card is rotated in 3D, and Shadow, which adds to the 3D effect through shadowing. The cards show an animation as they scroll into place within the carousel.

Advanced Slider Settings Coverflow Style

Main Module Design Settings

The main module’s Design settings include the image overlay, alignment, width, border, and box shadow. It also includes settings for the title text, subtitle text, body text, next and previous buttons, navigation color, z-index for the image, custom spacing for every element, and the standard Divi settings. I’ve adjusted many of the settings in the example below.

Updated Carousel Design

The Next and Previous arrows include several position options. You can adjust the color of the icons and backgrounds and choose custom icons for the previous and next links independently. You can also adjust the dot navigation’s colors.

Styling for next, previous buttons and dot navigation

The Divi Carousel Module has an impressive amount of custom spacing options. Add margin and padding to every element for both the container and the content independently. I’ve added padding to several of the elements in the example below.

Deep spacing settings available

Using Divi Carousel Module

Divi Carousel Module is great for displaying lots of things including products, team members, custom blog posts and pages, services, images, testimonials, a portfolio, company logos, and lots more. The publisher’s website includes lots of downloadable templates to get you started. They’re available as JSON files. Upload them to your Divi Library and use them on any template, page, or post. Let’s look at a few of them. I’ll describe their main settings as we go.

Divi Carousel Module Content Carousel 02_05

Content Carousel 02_05 includes large images and styles the cards independently to create an alternating design with the image on the top or the bottom. It shows three slides at a time on desktops, 2 on tablets, and 1 on phones. It slides them automatically every second and loops.

Using Divi Carousel Module

Divi Carousel Module Testimonial Carousel 01_07

Testimonial Carousel 01_07 displays two slides on desktops and one slide on tablets and phones. It includes centered arrows and dot navigation. The slides place the images to the left and include a gradient behind the text. The quote icons are images added to the background.

Using Divi Carousel Module

Divi Carousel Module Team Carousel 01_05

Team Carousel 01_05 displays three slides on desktops, two on tablets, and one on phones. The slides have a unique design with social icons placed at the bottom. The backgrounds of the main content area alternate between black and white. The arrows and dots are green. Images use rounded corners and include a 4px border to make them circled.

Using Divi Carousel Module

Divi Carousel Module Image Carousel 01_02

Image Carousel 01_02 displays 3.5 items on desktops and centers the slides to create the design that partially shows images on the sides of the screen. Tablets display 3 and phones display 1. It includes arrow navigation, and the slides are set to loop, so the user never has to change directions to see all the slides. The rounded corners give the images an elegant design.

Using Divi Carousel Module

Purchase Divi Carousel Module

Divi Carousel Module is available in the Divi Marketplace for $29. It includes unlimited usage, a 30-day money-back guarantee, and one year of support and updates.

Purchase Divi Carousel Module

Ending Thoughts

That’s our look at Divi Carousel Module. The module has a lot of features. Each element can be styled and adjusted independently, giving you lots of design possibilities. I found all the settings to be intuitive, so it felt at home in the Divi Builder. If you’re interested in a carousel module with lots of features, Divi Carousel Module is worth a look.

We want to hear from you. Have you tried Divi Carousel Module? Let us know what you think about it in the comments.

Divi Marketplace

Are You A Divi User? Find Out How To Get More From Divi! 👇

Browse hundreds of modules and thousands of layouts.

Visit Marketplace
Divi Marketplace
Divi Cloud

Find Out How To Improve Your Divi Workflow 👇

Learn about the new way to manage your Divi assets.

Get Divi Cloud
Divi Cloud
Divi Hosting

Want To Speed Up Your Divi Website? Find Out How 👇

Get fast WordPress hosting optimized for Divi.

Speed Up Divi
Divi Hosting
Premade Layouts

Check Out These Related Posts

Get a Free Alteration Shop Layout Pack for Divi

Get a Free Alteration Shop Layout Pack for Divi

Posted on February 6, 2023 in Divi Resources

Hey Divi Nation! Thanks for joining us for the next installment of our weekly Divi Design Initiative; where each week, we give away a brand new Layout Pack for Divi. This time around, the design team has created a beautiful alteration shop Layout Pack that’ll help you get your next Alteration...

View Full Post
Divi Product Highlight: Header Layout Pack

Divi Product Highlight: Header Layout Pack

Posted on February 5, 2023 in Divi Resources

The header is one of the first elements to load for any Divi website you create. This means the header often makes the first impression anyone sees for a website, making header design a crucial part of every website. Fortunately, you don’t have to create your header from scratch. There are lots...

View Full Post

5 Comments

  1. DIVI Carousel Maker
    The Best!

  2. Hi
    I would like to create a shop item carousel. Is it possible to use the carousel module to build carousels with WooCommerce content?

  3. I bought the licence for this Divi Carousel Module plugin by DiviGear from the ET Marketplace in Dec ’21. Looks really great in one of my banners as it showcases my book covers in a perpetual slide, and I’ll be using it on other sites. It has lots of styles and variations to choose from, and the layout samples to download from the DiviGear website pages are easy to use and customise.

  4. Man, waiting for the time when these essential features are something that come out of the box.

  5. I tried this plugin, however, it made the website so slow that I had to remove this plugin from the website. So, it would be better if ET can come up with something like this as a default module in Divi Builder.

Leave A Reply

Comments are reviewed and must adhere to our comments policy.

Join To Download Today