Customize Happy Addons ‘Carousel’ widget. You can add different links or lightbox for each slides. I use the same video lightbox for all slides in this example.
Worth to note that there is a bug with this widget: it shows all the slides vertically upon loading. To cover it, use motion effect for entrance (such as fade-in) or a preloader. The best use for this widget is outside the initial viewport. In that way, no effect nor preloader needed. Just like on this page.
/* Remove selector to apply it to the whole page */
/* Overflow */
selector div.slick-list
{ overflow: visible }
/* Move the text content to the bottom */
selector .ha-slick-content {position: unset}
/* Image Border Radius */
selector .slick-slide img {border-radius: 5px;}
/* Disable Inactive Arrow */
selector .slick-disabled {opacity: .0}
This is how ‘carousel post’ widget by Happy Addons looks like without any custom CSS, only style adjustments.
Note: Remember to set the Z-index into ‘1’, otherwise it will float over the header on the frontend, even if you set the header z-index ‘999’, like this one below:
Custom CSS added on this one and it has lower Z-index than the header (not blank).
In some cases, you might want to use an alternatives for your “carousels” idea. Here’s one:
- Happy Addons ·