---
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-04-14
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 Scroll Navigation block connects with Carousel Anything block for unique dot navigation.
- Users disable the Dots toggle in the Dots & Arrow tab of Carousel Anything block to integrate Scroll Navigation.
- Navigation items in Scroll Navigation block must match the number of slides in Carousel Anything block for proper functionality.

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: What should I do if the Scroll Navigation dots are not working with the Carousel Anything block?**
A: If the Scroll Navigation dots aren't functioning, ensure that you've disabled the Dots toggle in the Dots & Arrow tab of the Carousel Anything block. This step is crucial because keeping the Dots toggle enabled can interfere with the connection between the two blocks. Additionally, verify that the Unique Carousel ID in the Carousel Remote Sync ID tab matches the Carousel Connection ID in the Scroll Navigation block.

**Q: What is the best practice for setting up navigation items in the Scroll Navigation block?**
A: When adding navigation items in the Scroll Navigation block, ensure that the number of items matches the number of slides in the Carousel Anything block. This alignment is critical for proper functionality. You can also enhance user experience by adding tooltips and icons to your navigation items, making it easier for users to understand what each item represents.

**Q: What happens if I forget to add the Unique Carousel ID in the Carousel Anything block?**
A: Forgetting to add the Unique Carousel ID in the Carousel Anything block will prevent the Scroll Navigation from functioning correctly. The connection relies on this ID to sync the navigation with the carousel slides. If the IDs do not match, the navigation dots will not control the carousel, leading to a disjointed user experience.