---
title: "How to connect Process Steps with Carousel Anything Widget in Elementor?"
url: https://theplusaddons.com/docs/connect-process-steps-with-carousel-anything-in-elementor/
date: 2023-02-16
modified: 2026-09-14
lang: en
author: "Aditya Sharma"
description: "A step-by-step process is easier to follow when each step has a picture or a short demo next to it. The Plus Addons for Elementor can connect the Process/Steps widget..."
image: https://theplusaddons.com/wp-content/uploads/2023/02/How-to-connect-Process-Steps-with-Carousel-Anything-Widget-in-Elementor-1024x536.jpg
word_count: 382
---

# How to connect Process Steps with Carousel Anything Widget in Elementor?

## 

- Connects Process Steps widget with Carousel Anything widget using Unique Carousel ID from The Plus Addons for Elementor.
- Requires matching number of slides in Carousel Anything widget and steps in Process Steps widget for proper functionality.
- Enables synchronized interaction between the two widgets, allowing slider play mode on mouse hover or click.

A step-by-step process is easier to follow when each step has a picture or a short demo next to it.

The Plus Addons for Elementor can connect the **Process/Steps** widget to a **Carousel Anything** slider. Hovering or clicking a step shows its slide, and moving the slider highlights the matching step.

*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 Process/Steps 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 **Process/Steps** widget switched on as well.- A Carousel Anything widget with one slide per step (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: Connect the Steps

- Add the **Process/Steps** widget and add one step per carousel slide, in the same order.- In **Content**, turn on **Carousel Anything Connection**.- Type the same ID in **Connection Carousel ID**.

![The Carousel Anything Connection switch and Connection Carousel ID field of the Process/Steps widget](https://theplusaddons.com/wp-content/uploads/2026/09/carousel-steps-connection.webp)

- Choose **Effect on**: **Hover** (the default) or **Click**.

![The Effect on option of the Process/Steps widget with Hover and Click](https://theplusaddons.com/wp-content/uploads/2026/09/carousel-steps-effect.webp)

Publish the page and try it on the front end.

![Process steps and a carousel changing together as each step is selected](https://theplusaddons.com/wp-content/uploads/2023/02/carousel-anything-steps-demo.gif)

## How It Behaves

- With **Click**, clicking the third step moves the carousel to the third slide and highlights that step. Hovering a step does nothing.- With **Hover**, pointing at the third step moves the carousel to the third slide.- It also works the other way: when the carousel moves to the fourth slide, the fourth step becomes active.

## Limitations

- Steps 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 Process/Steps widget, **Carousel Anything Connection** only shows an upgrade notice.

## Troubleshooting

### Selecting a step does not move the carousel

- Check that both IDs are exactly the same, with no spaces.- Check **Effect on**: with **Click**, hovering does nothing.

### The wrong step is highlighted

Put the steps 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 an Info Box with Carousel Anything](https://theplusaddons.com/docs/connect-infobox-with-carousel-in-elementor/)- [Connect Carousel Remote with Carousel Anything](https://theplusaddons.com/docs/connect-carousel-remote-with-carousel-in-elementor/)