# Carousel

Only supported in the WEB channel.

Carousels are a set of cards which displays the items with Click to Action buttons (CTAs) associated with each card.

Setting up 'Carousel' action block

Carousels action block is made up of 2 sections;

1. Configuring Cards
2. Variables

#### Configuring Cards: <a href="#configuring-cards" id="configuring-cards"></a>

In order to display the items, you will need to add the cards to the action block by clicking on ‘+ Card’.

**Note**:

* Maximum number of cards allowed is 10
* Ideal count is between 3 to 7 cards

You can click on the card to configure it.

Card consist of following elements:

| Image            | A cover image for each card.                                                                                                                                                                                             |
| ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| Card title       | Title of the card.                                                                                                                                                                                                       |
| Card description | Brief description of the card.                                                                                                                                                                                           |
| Buttons          | Call to action buttons for each card. You can add a max of 2 buttons. Button types: - **Branch:** On click, moves the chat to the next step in the flow. - **URL:** Opens a URL on the browser; flow ends at that point. |

Maximum of **three buttons allowed**.

#### Variables: <a href="#variables" id="variables"></a>

Variables are used to store the input received from the visitor, so you can reference it for later use.

You can either choose an existing variable from the dropdown or create a new one.

Only Branch button selection made by the visitor will be stored in the variable.

[Learn more about variables here.](/wotsabot-help-articles/variables.md)

#### Example: <a href="#example" id="example"></a>

Imagine you are building a chatbot to showcase the properties offered in your real estate company.

You can use Carousel to display all the properties offered by you with an image, name of property and details of some amenities offered.

And the buttons can be:

* **Learn more** -- which redirects to your webpage with more details.
* **Book a visit** -- which continues the flow asking for contact info to book a site visit.

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


---

# 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://help.wotsabot.ai/wotsabot-help-articles/bot-builder/action-blocks/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.
