> ## Documentation Index
> Fetch the complete documentation index at: https://help.wotnot.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Carousel

> Displays a set of cards in a scrollable format.

The Carousel block shows multiple cards, with each containing a cover image, title, description and call-to-action (CTA) buttons. It is useful for showcasing products, properties, plans, services, or other options where a visual presentation helps users make a choice.

![Image](https://mintcdn.com/wotnot/zc_a16P1uDjl42Rz/images/image-265.png?fit=max\&auto=format\&n=zc_a16P1uDjl42Rz\&q=85\&s=63a43ae55face38f7cd3714833997a9f)

> [!NOTE]
>
> Only supported in the **Web** channel.

If you only need to display images without buttons, use the [Image gallery](https://help.wotnot.io/build/blocks/image-gallery.md) action block. For text-based options grouped into categories, use the [List](https://help.wotnot.io/build/blocks/list.md) action block.

# Using the Carousel block

Drag the **Carousel** action block onto the canvas and connect it to the next step in your flow.

To add a card, click **+ Card** and configure the card content and buttons.

![Image](https://mintcdn.com/wotnot/zc_a16P1uDjl42Rz/images/image-266.png?fit=max\&auto=format\&n=zc_a16P1uDjl42Rz\&q=85\&s=c3c32d3caf38ab64f7c51fe1a41c6ded)

## Configurations

You can add multiple cards to the carousel and configure each card individually.

> [card] LIMITATIONS
>
> * Max cards allowed is 10
> * Max image file size is 5 mb
> * Recommended image dimension 16:9

### Card content

Each card can contain the following:

* **Image** — The cover image displayed on the card.
* **Card title** — The title displayed on the card.
* **Card description** — A brief description of the item.
* **Buttons** — CTA buttons that let the visitor take an action.

### Card buttons

You can add up to **3 buttons** to each card.

* Each button can use one of the following actions:

> [card] Branch
>
> * Moves the conversation to the next connected step in the flow.
> * Use **Branch** buttons when the visitor's selection should determine what happens next in the chatbot flow.

> [card] URL
>
> * Opens the specified URL in the visitor's browser. The conversation flow ends at that point.
> * Use **URL** buttons when you want to send the visitor to an external webpage.

### Variables

Variables store the input received from the visitor so you can use the selected value later in the flow.

You can select an existing variable from the dropdown or create a new variable.

> [!NOTE]
>
> Only selections made using a **Branch** button are stored in the variable. URL button clicks are not stored as variable values.

For more information, see [Variables](https://help.wotnot.io/data/variables.md).

### Enable free text

Enable **free text** to allow visitors to either select one of the predefined buttons or enter their own response in the chat input.

When enabled, a **Free text** node is added to the canvas. You can connect this node to an [AI Agent](https://help.wotnot.io/build/blocks/ai-agent.md) action block to handle the visitor's free-text response.

This is useful when you want to provide predefined choices while still allowing visitors to enter a response that is not available as a button.

![Enable free text](https://mintcdn.com/wotnot/KsQ-zr0VbihC7Wze/images/image-\(2\)-1.png?fit=max\&auto=format\&n=KsQ-zr0VbihC7Wze\&q=85\&s=7a4a6b330054f49f395a2db626b9e859)

[Loom video player](https://www.loom.com/embed/1979f3e4bd824781a3eacce6a463e3ee)

## Output paths

Each **Branch** button creates a separate output path from the Carousel block.

Connect each button's path to the step you want the chatbot to follow after the visitor selects that button.

If a Branch button's output path is not connected, the chatbot cannot continue to a subsequent action from that selection.

**URL** buttons do not create a flow path. When the visitor clicks a URL button, the URL opens in the browser and the flow ends at that point.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.