The easy way to create a beautiful image carousel using Divi Supreme Image Carousel Module. The image carousel module is perfect for showcasing a set of images, your portfolio pieces, client logos and much more.
+Add Gallery Images
Choose multiple images from your Media Library here.
You can change the order of the images to default(show images the way you selected) or Random(Shows images randomly)
Change the size of all the images here.
Here you can change Carousel Slide Effect from 4 different effects.
Coverflow Effect settings
If you'll select Carousel Effect as Coverflow you'll see these options:
- Show Shadow - Adds a shadow to next Carousel Images.
- Coverflow rotate - Set the Rotate amount of the next images in the slide.
- **Coverflow Depth **- Increase to show more items in the carousel with coverflow effect.
You can change the Carousel Content Direction from here, It can be either "Left to Right" or "Right to Left".
This mode will show the next image in the carousel centered means half of the image will be appearing which tells there are more items to see.
Slides to Show
Here you can change the number of images to show in one slide.
Slides to Scroll
Here you can change the number of slides to scroll when click on the arrow button to see the next items.
Here you can change the speed for sliding the slider.
Use Multiple Row
You can enable this option If you want to show multiple rows of Images, lets say you enter 2 in the "Row Per Slide" field and then you'll see two Rows of Images, a new one below the first one and It will work the same way. You can change the "Row Per Slide" value to whatever you like.
You can enable this option to slide images automatically.
Autoplay Change interval
Change the time interval for the slides to change after that time.
Add some spacing between carousel images.
Enabling this option causes the carousel to loop. Means when you’ll click on the arrow to go to next slide it will then keep looping and shows all the item from first to end. Disabling this will show only the number of images and you can’t use the next arrow if slides are ended then you’ll have to use the previous arrow.
Enable or Disable this option to show or hide the arrows.
Enable or Disable this option to show or hide the pagination dots.
Use this option to disable touch/drag to slide the Carousel.
Use Grab Cursor
Enable or Disable this option to make the mouse icon to grab cursor icon.
Open Image in Lightbox
Enable or Disable this option to open the images in the lightbox when click on a single image. Enabling this option will reveal some more options too.
Here you can change the Size of the Image when opened in Lightbox.
Lightbox in Gallery Mode
Enable this option If you want a gallery in lightbox, this will show next & prev arrow in the Lightbox to switch to another Image in carousel.
Enable this option If you want to show Image Caption in lightbox. You can set Image caption by opening the Image in Media Library.
Change the horizontal alignment of the images. If you have small and big size images in the carousel then this option would be helpful.
Change the arrow position to inside or outside of the carousel.
Mobile Arrow Position
Change the arrow position to inside or outside of the carousel for Mobile Devices only.
Change the font size of the arrow.
Change the color of the arrow.
Arrow Background Color
Change the background color of the arrow.
Here you can change the Position of the Pagination dots vertically.
Pagination Active Color
Change the color of the Active dot in the Pagination
Pagination In-Active Color
Change the color of the In-Active pagination dots here
This is the place where you can add corner radius, borders, box shadow and more stuff to the carousel images.
Use the advanced options to give your Price List module custom CSS ID’s and Classes. Add some custom CSS for advanced styling and designate the module’s visibility on certain devices.
How to add URL to each Carousel Image
Adding a URL to the Image
If you want to add a URL to each Carousel Image you can do that easily. All you've to do is open up that Image in the Media Library and add the Custom URL to it there. So when a user will click on the Image they’ll be taken to that URL that you added to Image. It will only work within Divi Supreme Modules.
Adding Download link to the Image
If you want to let your users download a file when they click on the image you can simply enter the URL of that download file and check the option “Download as File”.