# Carousel

### 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.

{% @arcade/embed flowId="hIQ7uUEoYizbRAKsBVwA" url="<https://app.arcade.software/share/hIQ7uUEoYizbRAKsBVwA>" %}

### Display Settings

#### Navigation Controls

* **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.

<figure><img src="/files/ETd0UMaUiugdmImXQFLj" alt=""><figcaption></figcaption></figure>

#### Carousel Steps

* **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.

#### Navigation Options

* **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.

{% hint style="info" %}
More information about Actions and additional properties you can find in our documentation.
{% endhint %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.jetadmin.io/user-guide/design-and-structure/components/lists/carousel.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
