Overview
In this guide, you will learn everything you need to know about the carousel highlight settings and how they work. You can make the center module in the carousel stand out from the others to draw attention and focus. When this option is enabled, additional design settings will appear to adjust the size, opacity, and blur of the other modules. The highlight settings can all be found in with the other carousel settings in Row settings>Column settings>Carousel tab in the Highlight Settings toggle. You should also check out the highlight settings demo to get some inspiration, or download our free layouts in the demo site to give you a quick start!
View Live Demo
View Settings List
Highlight Center Module
The highlight center module feature allows you to place an emphasis on the center module. This can be done by customizing the non-centered modules with several effects like opacity, blur, and size. To begin using the Center Mode, simply toggle on the setting. You will then see additional options appear below.
Non-Highlighted Module Opacity
The first setting allows you to adjust is the opacity filter of the non-highlighted modules. This setting decreases the opacity of the other modules which are not in center, which means the highlighted center module will be fully visibility and draw more focused attention. By default, the value of opacity is set to 100% which makes the modules completely visible, so you will need to manually adjust this as desired. The opacity effect has a range is 0% to 100% with 1% increments.
Non-Highlighted Module Blur
The second setting allows you to add a blur effect to the non-highlighted modules. This setting blurs out the other modules which are not in center, which means the highlighted center module will be clear and draw more focused attention. By default, the value of opacity is set to 0px which makes the modules completely clear, so you will need to manually adjust this as desired. The blur effect has a range of 0px to 5px with 1px increments.
Non-Highlighted Module Size
The third setting allows you to change the size of the non-highlighted modules. This setting decreases the size of the other module which are not in the center, which means the center module will be full size and appear bigger than the others to draw more focused attention. By default, the value of this property is set to 1 which makes the size of the highlighted and non-highlighted modules the same, so you will need to manually adjust this as desired. The size effect has a range of 0 to 1 with .1 increments.
