Divi Essential Documentation

  1. Home
  2. Docs
  3. Divi Essential Documentation
  4. Modules Documentation
  5. Divi Carousel

Divi Carousel

An exquisite horizontal image slider allows you to promote brands, products, sponsors, and many more

Content → New Item

Within the content tab, we have the option for you to add new items. You can add as many items as you like here. 

Content → Slider Elements → Four Layouts

There are four layouts within Slider Elements. You can pick any of them for each item according to your requirement. 

Here are the four layouts:

  • Image
  • Text
  • Text Inside The Image 
  • Text Below The Image 

Content → Slider Elements → Image Layout

Within an item, if you went for the image layout, place an image of your choice.

Content → Slider Elements → Text Layout

We are showing you the text layout above. Here you can add text as a carousel slider item.

Content → Slider Elements → Text Inside The Image

In the Text Inside The Image layout, you can add text to the image which will appear on the image.

Content → Slider Elements → Text Below The Image

In the Text Below The Image layout, you can include the text below the image just as the name suggests. 

Content → Carousel Settings

In the Carousel Settings you have the option to Loop, Autoplay, adjust the delay, Center Slide to highlight one of the slides that are in view, adjust the Speed, Space Between, put a number of Slides Per View to pick a specific number of slides you want to appear on your website. Finally, pause on hover allows the slider to pause when you hover on it. 

Content → Navigation Settings

In the Navigation Settings, you have the option to select the provided navigation tools.

  • Grab Cursor shows a handtool for you to move the slider manually.
  • Keyboard Navigation helps the slider move with the keyboard arrow buttons
  • Mousewheel Navigation helps the slider move using the mouse scroller.
  • Arrow Navigation puts arrows on each side of the design and on click you can move the slider.
  • Dynamic Bullets helps show the active bullet when sliding.

Content → Effect Settings

This feature helps put a little effect on each item in the slider. 

Add a little shadow enabling the Use Slide Shadow option

Adjust Slide Rotate so the items will slide with the rotation level applied to the item. 

Add Stretch and Depth to adjust the space between the items. 

Design → Text Setting

Within Text Settings, you have everything you need to stylize your text. From Font, Font Style, Text Alignment, Text color, editing Letter Spacing and adjusting Text Size, adding a Border, Border color to shadows, and more. 

Design → Content Settings

Just like Text Settings, within Content Settings, you have everything you need to stylize your text. 

Design → Image Settings

Image Settings allow you to stylize the image you’ve added to your design layout.

To elaborate, we have some helpful design tools present here.

  • Add rounded corners
  • Include border style, width, and color
  • Adjust image filter using the editing tools provided.
  • You can also add box-shadow here

Design → Color Settings

In Color Settings, you get to select specific colors for Arrow, Arrow background, Dots, and Active Dot’s color. In just a few clicks, you can achieve a great design with this feature.

Design → Arrow Settings

And finally, for Arrow Settings, you have the option to position your Arrows and resize them.

Was this article helpful to you? Yes No 1

How can we help?