---
title: "How to connect an Infobox with Carousel in Elementor?"
url: https://theplusaddons.com/docs/connect-infobox-with-carousel-in-elementor/
date: 2023-02-16
modified: 2026-09-14
lang: en
author: "Aditya Sharma"
description: "A row of feature boxes above a large slider is a common layout: each box names a feature, and the slider shows it in detail. With The Plus Addons for..."
image: https://theplusaddons.com/wp-content/uploads/2023/02/How-to-connect-an-Infobox-with-Carousel-in-Elementor-1024x536.jpg
word_count: 449
---

# How to connect an Infobox with Carousel in Elementor?

## 

- Connects the Carousel Anything widget with the Infobox widget using a Unique Carousel ID in The Plus Addons for Elementor.
- Ensures the number of slides in the Carousel Anything widget matches the items in the Infobox widget for proper functionality.
- Allows customization of active infobox items and play modes through the Default Active dropdown and Effect on dropdown settings.

A row of feature boxes above a large slider is a common layout: each box names a feature, and the slider shows it in detail.

With The Plus Addons for Elementor you can connect the **Info Box** widget (in its Carousel layout) to a **Carousel Anything** slider. Hovering or clicking a box moves the slider to the matching slide.

*To check the complete feature overview documentation of The Plus Addons for Elementor Carousel Anything widget, [click here](https://theplusaddons.com/docs/carousel-anything-elementor-widget-settings-overview/).*

***Requirement - This widget is a part of The Plus Addons for Elementor, make sure it's installed & activated to enjoy all its powers.***

[LIVE WIDGET LINK](https://theplusaddons.com/elementor-widget/carousel-slider/?utm_source=tpae&utm_medium=docs&utm_campaign=text)

## Before You Start

- **Edition:** **Pro** — The Info Box connection needs The Plus Addons for Elementor Pro. The Carousel Anything widget itself is free.- **Widget to enable:** Carousel Anything, switched on under **The Plus Addons > Widgets**.- The **Info Box** widget switched on as well.- A Carousel Anything widget with one slide per Info Box item (see the [settings overview](https://theplusaddons.com/docs/carousel-anything-elementor-widget-settings-overview/)).

## Step 1: Give the Carousel an ID

- Select the **Carousel Anything** widget.- Open **Content > Extra Options** and type an ID in **Unique Carousel ID**, for example `plans`.

![The Unique Carousel ID field in the Extra Options section of the Carousel Anything widget](https://theplusaddons.com/wp-content/uploads/2026/09/carousel-unique-id.webp)

## Step 2: Switch the Info Box to Carousel

- Add the **Info Box** widget.- In **Content**, set **Select Layout** to **Carousel**.- Add one item per carousel slide, in the same order as the slides.

![The Select Layout option of the Info Box widget set to Carousel](https://theplusaddons.com/wp-content/uploads/2026/09/carousel-infobox-layout.webp)

## Step 3: Connect the Info Box

- Turn on **Carousel Anything Connection**.- Type the same ID in **Connection Carousel ID**.- Choose **Effect on**: **Hover** (the default) or **Click**.- Optionally pick an item in **Default Active**.

![The Carousel Anything Connection switch and the Connection Carousel ID, Default Active and Effect on fields of the Info Box widget](https://theplusaddons.com/wp-content/uploads/2026/09/carousel-infobox-connection.webp)

Publish the page and hover or click the Info Box items on the front end.

![An Info Box carousel with four items above a connected Carousel Anything slider showing the third slide](https://theplusaddons.com/wp-content/uploads/2026/09/carousel-result-infobox-pair.webp)

## How It Behaves

- With **Effect on** set to **Click**, clicking the third item moves the carousel to the third slide.- With **Hover**, pointing at the third item does the same.- When the Info Box shows one item at a time, moving its own slider moves the carousel too, and moving the carousel moves the Info Box slider to the matching item.

## Limitations

- Items and slides are matched by position only. Keep them in the same order and number.- The connection is not part of the free plugin: in the free Info Box, **Carousel Anything Connection** only shows an upgrade notice.- The connection is only available in the Info Box **Carousel** layout, not in **Listing**.

## Troubleshooting

### Hovering or clicking an item does not move the carousel

- Check that both IDs are exactly the same, with no spaces.- Check **Effect on**: with **Click**, hovering does nothing.- Make sure **Select Layout** is **Carousel**.

### The carousel shows the wrong slide

Put the Info Box items in the same order as the carousel slides.

## Related Docs

- [Carousel Anything widget: settings overview](https://theplusaddons.com/docs/carousel-anything-elementor-widget-settings-overview/)- [Connect Process Steps with Carousel Anything](https://theplusaddons.com/docs/connect-process-steps-with-carousel-anything-in-elementor/)- [Connect Carousel Remote with Carousel Anything](https://theplusaddons.com/docs/connect-carousel-remote-with-carousel-in-elementor/)- [Connect a carousel with tabs](https://theplusaddons.com/docs/connect-a-carousel-with-tabs-in-elementor/)