A carousel displays a series of elements (like images or cards) in a rotating manner, allowing users to navigate through them easily. Users can navigate using controls, scroll, or drag, based on your

How It Works

To set up a carousel, simply type "carousel" in the component search bar and drag it to your page. Then, connect the carousel to your data source.

Display Settings

  • Side Controls: Arrows on the left and right sides.

  • Header Controls: Buttons at the top.

  • No Controls: Navigation through dots at the bottom of the elements without using additional slider buttons.

  • Row Steps: Scroll a complete row with one click on the slider button.

  • Custom Steps: Specify the number of elements to scroll with one click on the slider button.

  • Scroll Navigation: Navigate using the mouse wheel or trackpad.

  • Drag Navigation: Navigate by dragging elements.

  • Snap to Cards: Snap to individual cards while navigating.

Cards Per Row

Set the number of elements shown in a single row (e.g., 3 cards per row).

Cards Per Query

Define how many elements are included in the carousel based on a specified number.

Advanced Settings

Selection Options

  • Multiple Selection: Allow multiple cards to be selected.

  • Select First Card by Default: Automatically select the first card.

  • Enable Search: Add a search function to filter elements.

  • Display Filters: Show filtering options.

  • Display Pagination: Enable pagination controls.

More information about Actions and additional properties you can find in our documentation.

Last updated