---
title: "How to Connect the Scroll Navigation with Carousel Anything Block in WordPress?"
url: https://nexterwp.com/docs/connect-the-scroll-navigation-with-carousel-anything-block-in-wordpress/
date: 2024-12-12
modified: 2026-08-18
author: "Aditya Sharma"
description: "Do you want to add unique dot navigation to your slider? By connecting the Carouse Anything block with the Scroll Navigation block from the Nexter Blocks, you can easily use..."
image: https://nexterwp.com/wp-content/uploads/2024/12/How-to-Connect-the-Scroll-Navigation-with-Carousel-Anything-Block-in-WordPress_-1024x519.jpg
word_count: 255
---

# How to Connect the Scroll Navigation with Carousel Anything Block in WordPress?

## Key Takeaways

- Nexter Blocks connects the Carousel Anything block with the Scroll Navigation block so the Scroll Navigation dot acts as slider navigation.
- Carousel Anything disables the Dots toggle in the Dots & Arrow tab and adds a Unique Carousel ID in the Carousel Remote Sync ID tab.
- Scroll Navigation matches the number of navigation items to the number of Carousel Anything slides and uses the same ID in the Carousel Connection ID field.

Do you want to add unique dot navigation to your slider? By connecting the Carouse Anything block with the Scroll Navigation block from the Nexter Blocks, you can easily use the Scroll Navigation dot as your slider navigation. 

*To check the complete feature overview documentation of the Nexter Blocks Scroll Navigation block,* *[click here](https://nexterwp.com/docs/create-one-page-scroll-navigation-in-wordpress/).*

***Requirement  - This block is a part of the Nexter Blocks, make sure it's installed & activated to enjoy all its powers.***

[LIVE BLOCK LINK](https://nexterwp.com/nexter-blocks/blocks/wordpress-one-page-scroll-navigation/)

To do this, add both the Carouse Anything and Scroll Navigation block to the page and follow the steps - 

1. Add content to the Carousel Anything block slides using either the Pattern or Editor.

2. Then go to the **Dots & Arrow** tab and disable the **Dots** toggle.

3. Next, go to the **Carousel Remote Sync ID **tab and add an ID in the **Unique Carousel ID** field.

4. Then go to the Scroll Navigation block and select an appropriate style and direction for the navigation from the **Layout** tab.

5. After that, in the **Content** tab add navigation items, make sure the number of navigation items and the number of slides in the Carousel Anything block are same. 

In the navigation items, you can leave the Section ID field blank, you can add a tooltip and icon as required.

6. Then go to the **Connections **tab and add the same ID in the **Carousel Connection ID** field to make the connection.

Now you can navigate the Carousel Anything slider with the Scroll Navigation dots.

## Frequently Asked Questions

**Q: Why is my Scroll Navigation not controlling the Carousel Anything slider?**
A: The connection only works when both blocks share the same ID. The Carousel Anything block needs a value in the Unique Carousel ID field under Carousel Remote Sync ID, and the Scroll Navigation block needs that exact same value in the Carousel Connection ID field. If those IDs do not match, the dots will not control the slider. Nexter Blocks provides this connection through its Scroll Navigation and Carousel Anything blocks.

**Q: What do I need before connecting Scroll Navigation to Carousel Anything in WordPress?**
A: Both blocks have to be added to the page, and Nexter Blocks must be installed and activated first. The setup also depends on using the Carousel Anything block for slides and the Scroll Navigation block for the dot navigation. That matters because the connection is built inside Nexter Blocks, not as a separate WordPress feature.

**Q: How do I keep the dot navigation from showing twice on a carousel?**
A: Disable the Dots toggle in the Dots &amp; Arrow tab of the Carousel Anything block. The tutorial uses Scroll Navigation as the slider navigation, so leaving the built-in dots on would create duplicate controls. Turning them off keeps the interface cleaner and avoids confusing users with two different dot systems.

**Q: What is the best way to match Scroll Navigation items with carousel slides?**
A: Keep the number of navigation items and the number of slides exactly the same. The tutorial calls this out because each navigation item is meant to map to one slide in Carousel Anything. If they are out of sync, some dots will not correspond cleanly to a slide, which makes navigation feel broken even if the ID connection is correct.

**Q: Can I use Scroll Navigation as dot navigation for a slider on a WordPress one-page layout?**
A: That is exactly how Nexter Blocks positions it here. The Scroll Navigation block can act as unique dot navigation for a slider when it is connected to Carousel Anything, and Nexter also has a separate one-page scroll navigation guide at [click here](https://nexterwp.com/docs/create-one-page-scroll-navigation-in-wordpress/). The key detail is that this tutorial uses Scroll Navigation as remote slider control, not just section jumping.

**Q: What should I set in Scroll Navigation if I want a different look or direction for the dots?**
A: Use the Layout tab in Scroll Navigation to pick an appropriate style and direction. That choice matters because it changes how the navigation reads visually before you even connect it to Carousel Anything. After that, add your items in Content and keep them aligned with your slide count so the design choice does not create mismatch issues.
