wc.widgets.Carousel

The Carousel widget wraps around a third-party plug-in, Owl Carousel. The Carousel widget is used in Content Carousel and Recommendation widgets to display multiple contents that transition from one image to the next. By default, the pagination control that is inherited from Owl Carousel is disabled. HCL Commerce generates pagination control with specified pagination buttons.

Sample Output


Carousel sample output

Example

<div data-widget-type="wc.Carousel" data-widget-options="
   {‘prevButton’: ‘a.prevPageButton’, ‘nextButton’: ‘a.nextPageButton’, ‘overflowVisible’: true, 
      ‘owlCarouselOptions’: {‘singleItem’: true}}" >
</div>

Parameters

prevButton
(String) The jQuery selector for the Previous button. You can specify a false, unused value if a Previous button does not exist.
nextButton
(String) The jQuery selector for the Next button. You can specify a false, unused value if a Next button does not exist.
paginationButtons
(String) The jQuery selector for the pagination button. You can specify a false, unused value if a pagination button does not exist.
overflowVisible
(Boolean) Determine whether to display content that is bigger than the container.
owlCarouselOptions
(Object) Specify options that are supported by Owl Carousel, such as slideSpeed or singleItem.
contentContainer
(String) The element that contains the content.