The Carousel module allows you to display items (products, categories, images) in a single row fashion with the ability to indicate how many items should be visible in a row. The module supports single and multiple tabs (or sections), each with its own set of items.
The Carousel module can be added to any layout in all positions.
To create a Carousel module access it and click on the Create New button on the Add to Layout page, then refer to the explanations below to understand what they do. For an explanation of the Add to Layout page click here.
This is the page where you create the module. Additional styling for the Carousel is done in Settings > Modules > Carousel.
1 Module Name - This is the module name that will appear on the Add to Layout page.
2 Module Type - Indicate what type of Carousel Module you want to create. You can showcase Products, Categories or Brands. The Category type will display category images from Catalog > Categories > Data > Image. The Brand type will display the brand images (logos) from Catalog > Manufactures > Image.
3 Items per Row - Indicate how many items (products, categories or brands) you want visible per row for each resolution. Resize your browser down to see how the module adapts to each breakpoint. Adjust all sliders to achive your desired layout for each resolution.
4 Arrows - Optional left / right arrows that slide the hidden items into view.
5 Bullets - Optional bullets displayed below the carousel module.
6 Hide Title Bar - You can hide the title bar if you have a single carousel in the module without multiple tabs. Useful for when you want to display a set of brand logos and don't need the title bar.
7 Autoplay - Automatically starts the carousel.
8 Pause on Hover - Stops the carousel from sliding if you hover over the module.
9 Transition Delay - If Autoplay, the duration a slide is visible before advancing to the next one.
10 Transition Speed - The speed of the slide transition.
11 Disable on Mobile - Optionally disable the module on mobile devices.
12 Touch Drag - Enable or disable the horizontal swiping with the finger.