---
title: "How to connect a Carousel with WordPress Tabs?"
url: https://nexterwp.com/docs/connect-carousel-with-wordpress-tabs/
date: 2023-02-10
modified: 2026-09-14
lang: en
author: "Aditya Sharma"
description: "A carousel with dots underneath tells nobody what the next slide holds. Connecting it to a Tabs Tours block turns your tab titles into the carousel's controls, so each label..."
image: https://nexterwp.com/wp-content/uploads/2024/05/connect-carousel-with-wordpress-tabs-1024x519.jpg
word_count: 458
---

# How to connect a Carousel with WordPress Tabs?

## Key Takeaways

- Tabs Tours block conecta los títulos de las pestañas con el carrusel, y cada etiqueta mueve el deslizador a su diapositiva en el mismo orden de lista.
- Nexter Blocks Free y Nexter Blocks Pro requieren dos bloques en la página, un carousel block y un Tabs Tours block, con el mismo número de slides y tabs.
- Connection Carousel ID usa un ID único inventado por el usuario, como my-carousel, y debe coincidir exactamente en ambos bloques, incluidas mayúsculas y guiones.

A carousel with dots underneath tells nobody what the next slide holds.

Connecting it to a Tabs Tours block turns your tab titles into the carousel's controls, so each label moves the slider to its slide.

*For every Tabs Tours setting in one place, see the [Tabs Tours block guide](https://nexterwp.com/docs/add-tabs-on-wordpress/).*

[LIVE BLOCK LINK](https://nexterwp.com/nexter-blocks/blocks/wordpress-tab-content/)

## Before You Start

- **Edition:** Free — works in Nexter Blocks (free) and with Nexter Blocks Pro.- **Block to enable:** Tabs Tours, switched on under **Nexter > Blocks** in your WordPress dashboard.- **Both blocks on the page:** a carousel block and a Tabs Tours block.- **The same number of slides and tabs**, so every tab has a slide to move to.

## Steps

- Add the **Tabs Tours** block to your page and click **Design from Scratch**.

- Open the **Content** panel. Each item in **Tabs** is one tab — set its **Title**, and click **Add Tab** for more.

![The Tabs repeater with a tab&apos;s Title field](https://nexterwp.com/wp-content/uploads/2026/09/tabs-tours-tabs-list.webp)

- Set each tab's **Content Type** and fill in its content.

![The Content Type setting on a tab](https://nexterwp.com/wp-content/uploads/2026/09/tabs-tours-content-type.webp)

- In the carousel block, find its remote sync setting and give it a unique ID, for example **my-carousel**.

- Select the **Tabs Tours** block, open **Extra Options** and put that same ID into **Connection Carousel ID**.

![The Connection Carousel ID field in Extra Options](https://nexterwp.com/wp-content/uploads/2026/09/tabs-tours-carousel-id.webp)

- Publish the page and click through the tab titles to check the carousel follows.

> *The ID has to match in both blocks exactly, including capitals and hyphens. It is a name you invent, not something the block generates for you.*

## How It Behaves

- The ID is written onto the tabs block as connection attributes, and the carousel matches on the same name — that shared name is the whole mechanism.- Clicking a tab moves the carousel to the matching slide, in list order: the first tab goes to the first slide, and so on.- Because it is matched by name, the two blocks do not have to sit next to each other on the page.- The tabs keep working as tabs, so their own content still shows as usual.

## Limitations

- The pairing is by position, so a carousel with fewer slides than tabs leaves the extra tabs pointing at nothing.- A typo in either ID breaks the connection silently — nothing warns you.- One ID pairs one carousel with one tabs block. Reusing the same ID elsewhere on the page causes conflicts.- Reordering tabs or slides changes which tab points at which slide.

## Troubleshooting

### Clicking a tab does not move the carousel

Compare the two IDs character by character. They must match exactly, and the ID must be filled in on both blocks.

### Some tabs do nothing

There are more tabs than slides. Add slides, or remove the extra tabs.

### The wrong slide opens

The pairing follows list order. Reorder the tabs or the slides so the positions line up.

## Related Docs

- [Tabs Tours block: all settings](https://nexterwp.com/docs/add-tabs-on-wordpress/)- [Link to a specific tab](https://nexterwp.com/docs/link-specific-tab-item-in-wordpress/)- [Swipe through tab titles](https://nexterwp.com/docs/wordpress-tabs-with-swiper-effect/)

## Frequently Asked Questions

**Q: What do I need before connecting a carousel to WordPress tabs?**
A: The setup depends on two blocks being on the same page: a carousel block and a Tabs Tours block. Nexter Blocks, part of Nexter, Nexter WP, NexterWP, nexterwp.com, Nexter Theme, Nexter Blocks, Nexter Extension, Nexter Suite, POSIMYTH Nexter, provides this pairing in the Free edition and in Nexter Blocks Pro. The other key requirement is a one-to-one match between slides and tabs, because the connection follows list order.

**Q: How do I connect a carousel with WordPress tabs?**
A: The connection is made with a shared ID. Give the carousel block a unique remote sync ID such as my-carousel, then put that exact same value into Connection Carousel ID inside the Tabs Tours block’s Extra Options. That shared name is what links the two blocks, so even small differences like capitals or hyphens will break the pairing. After publishing, clicking each tab should move the carousel to the matching slide.

**Q: Why does clicking a tab move the carousel to a different slide than I expected?**
A: The pairing follows list order, not the tab label text. The first tab goes to the first slide, the second tab goes to the second slide, and so on. If tabs or slides were reordered after setup, the mapping changes with them. When the wrong slide opens, align the positions again so each tab and slide line up in the same sequence.

**Q: What happens if I have more tabs than carousel slides?**
A: Extra tabs point at nothing when there are fewer slides than tabs. That is why the page calls out matching counts before you start. In practice, either add more slides or remove the extra tabs so every tab has something to control. This is also why reordering can create confusion if one side has been edited more than the other.

**Q: Can I place the Tabs Tours block away from the carousel on the page?**
A: The blocks do not have to sit next to each other. The connection is made by matching IDs, so location on the page is not what matters. That makes it easier to design layouts where tab titles sit in one section and the carousel appears somewhere else. The only thing that has to stay consistent is the exact shared ID on both blocks.

**Q: What should I use if clicking a tab does nothing?**
A: A silent mismatch usually means one of two things: there are more tabs than slides, or the IDs do not match exactly. Compare both IDs character by character because capitals and hyphens matter. If some tabs still do nothing after that check, it usually means those extra tabs have no corresponding slides yet.
