For the last several years, Slick carousel has been my goto for carousels. The out of the box SXA carousel handles basic slider requirements fine, but for more complex needs, a more robust solution is required. Slick supports accessbility and responsive requirements easily and is featured enough to solve most requirments with plain configuration and can be extended to handle everything else.

Formerly a component in Sitecore Foundation, I pulled out the Slick Carousel feature into it’s own github project here. I tried upgrading to Slick 1.8, but had some issues with experience editor so moved it back to 1.6 and it seems to be completely functional in both published/preview as well as experience editing mode.

The required scripts and styles have been moved into their own Base Theme, which attaches itself to your custom theme on Site creation. So if you’re not using a custom theme, be sure to configure the dependency to your theme so the scripts are loaded.

The component itself supports the SXA grid settings and styles, and also makes many of the standard Slick options editable to content authors using “Component Properties.” For more control over the settings, you can even set the “Additional Options” field to comma separated JSON values which will get appended to the “Data-Slick” attribute giving you full control over your carousel configuration.

See the component in action in this video, recently posted to my channel:

All code is in github here. Installable Sitecore package available on the releases tab here. Built and tested on Sitecore 9.1 and SXA 1.8.

Let me know if you have any issues.