Overview
We have introduced a new Number of Rows feature in version 1.3 of the Divi Carousel Maker. The Number Of Rows setting is a very clever feature that allows you to build multiple rows of stacked modules in the carousel. In this guide, you will learn everything you need to know about creating carousels with multiple rows and show you why this is such an amazing breakthrough feature!
Understanding The Number Of Rows Setting
Most carousels have 1 row with multiple columns of modules. But if you want to make some advanced carousels, you can change the number of rows in order to build a carousel “slide” using a combination of multiple modules stacked together. The Number Of Rows setting is set to 1 by default, which is what you would use most of the time. So you would only change this if you properly understand how it works by following the instructions here in this guide.
Basic Demo Example
The best way to understand how this works is with some live example. If you go to our demo site, you will see the example carousel with 3 rows shown in the screenshots below. This is a very basic example of how this works and why it is so powerful. For this demo, I have simply set the Number Of Rows setting to 3, and then added a series of Image modules, Text Modules, and a Button modules in collated order.
Here I have illustrated the screenshot with red to indicate how the rows work. The Image modules are in the first row, the Text modules are in the second row, and the Button modules are in the third row.
Notice that the carousel is made up of many modules arranged in a very specific sequential order. The order of the modules shown is from 1 to 9. When the modules are added to the column, you need to add them in sets like Image, Text, Button, and then repeat Image, Text, Button, Image Text Button, Image, Text, Button, etc.
One important point to make is that the number of rows must equal the number of sets of modules. If you accidentally added another module, the carousel would become totally messed up, meaning the modules would not appear to stack properly as one group or “slide.” You will know if you make that mistake 🙂
An Even Crazier Example
Take a look at this next example. This is a product carousel, it uses 6 different modules to represent each product including Woo Product Images, Woo Product Title, Woo Product Description, Woo Product Price, Button, and Woo Add To Cart. The carousel Number Of Rows is set to 6, one for each module. All the modules are linked to their respective product.
Hopefully this shows just how amazing and powerful this feature is, and inspires you to create some awesome carousels!