--- title: "How to connect Carousel Remote with Carousel Slider in WordPress?" url: https://nexterwp.com/docs/connect-carousel-remote-with-carousel-slider-in-wordpress/ date: 2023-02-17 modified: 2026-09-21 lang: en author: "Aditya Sharma" description: "Carousel controls normally sit on the carousel. Sometimes the design wants them somewhere else entirely — in the column alongside, or above a full-width slider. Carousel Remote is a separate..." image: https://nexterwp.com/wp-content/uploads/2024/05/connect-carousel-remote-with-carousel-slider-in-wordpress-1024x519.jpg word_count: 569 --- # How to connect Carousel Remote with Carousel Slider in WordPress? ## Key Takeaways - Carousel Remote se empareja con Carousel Anything mediante el mismo Carousel ID, por ejemplo Ca1, y la coincidencia debe ser exacta, incluidas las mayúsculas. - Nexter Blocks Pro es obligatorio para que Carousel Anything y Carousel Remote se muestren; con Nexter Blocks Pro desactivado, no aparece ningún wrapper, configuración ni slides. - El emparejamiento funciona solo en la página publicada y en el navegador, no en el editor; cada pareja necesita un ID único para evitar que un remote controle dos carousels. Carousel controls normally sit on the carousel. Sometimes the design wants them somewhere else entirely — in the column alongside, or above a full-width slider. Carousel Remote is a separate block of controls, paired to a carousel by giving both the same ID. [LIVE BLOCK LINK](https://nexterwp.com/nexter-blocks/blocks/wordpress-advanced-carousel-sliders/) ## Before You Start - **Edition:** **Pro** — the Carousel Anything block needs Nexter Blocks Pro.- **Block to enable:** Carousel Anything, switched on under **Nexter > Blocks** in your WordPress dashboard.- A **Carousel Anything** block — see the [Carousel Anything guide](https://nexterwp.com/docs/add-carousel-anything-in-wordpress/).- A **Carousel Remote** block on the same page — see the [Carousel Remote guide](https://nexterwp.com/docs/add-carousel-remote-in-wordpress/).- **Test with several slides.** A carousel with one slide has nothing to move to, so most settings will look broken when they are simply idle. ## Video Tutorial ## Steps - Add both blocks to the page. ![Adding the carousel and the remote](https://nexterwp.com/wp-content/uploads/2023/02/carousel-anything-carousel-remote-unique-carousel-id-2-new.png) - Set a **Carousel ID** on the Carousel Anything block — for example `Ca1`. ![Setting the Carousel ID](https://nexterwp.com/wp-content/uploads/2023/02/carousel-anything-carousel-remote-prev-next-button-new.png) - Set the **same ID** on the Carousel Remote block. ![Matching the ID on the remote](https://nexterwp.com/wp-content/uploads/2023/02/carousel-anything-carousel-remote-dots-new.png) - Publish and use the remote on the real page. ## How It Behaves The pairing is made entirely through the shared ID, written onto the carousel as two attributes. - **Measured on a published page** with the ID `Ca1`: the carousel rendered `data-id="tpca-Ca1"` and `data-connection="tptab_Ca1"`. With no ID set, neither attribute appears.- **This is the same pairing scheme used across Nexter Blocks** — the same `tpca-` and `tptab_` pair as [Carousel Remote](https://nexterwp.com/docs/add-carousel-remote-in-wordpress/), [Interactive Circle Info](https://nexterwp.com/docs/add-an-interactive-circle-in-wordpress/) and [Accordion](https://nexterwp.com/docs/add-accordion-in-wordpress/). Learn it once and it applies to all of them.- **The IDs must match exactly**, including capitals. A mismatch produces no connection and nothing on the page says so.- **The carousel keeps its own controls too**, unless you switch its arrows and dots off — see the [arrows and dots guide](https://nexterwp.com/docs/showhide-arrows-dots-in-wordpress-carousel/).- **Every setting ends up in one place.** The block writes its whole configuration into a `data-splide` attribute on the carousel, which is what the slider script reads. If a setting is not doing what you expect, that attribute is where to look.- **Measured with Nexter Blocks Pro deactivated:** the carousel renders nothing at all — no wrapper, no configuration and no slides. This is a Pro-only block. ## Limitations - **Pro only** — measured with Nexter Blocks Pro deactivated, neither block renders anything.- **Give each pairing on a page its own unique ID**, or one remote will drive two carousels.- **Both blocks must be on the same page.** The connection is made in the browser, not on the server.- **It works on the published page**, not in the editor, so the pairing cannot be checked while building.- **Keep the remote near the carousel.** Controls far from what they control are confusing, particularly on a phone where the two may not be visible together. ## Troubleshooting ### The remote does nothing Check the IDs match exactly on both blocks, that Nexter Blocks Pro is active, and that you are on the published page rather than the editor. ### One remote is moving two carousels They share an ID. Give each pairing its own value. ### It works on desktop but the controls are lost on mobile The remote and the carousel have stacked apart. Move the remote directly above the carousel at the phone breakpoint. ### I set the ID but see no connection attributes Measured, the carousel renders `data-id` and `data-connection` only when an ID is present. If they are absent, the ID has not been saved — re-enter it and update the page. ## Related Docs - [Add a Carousel Remote in WordPress](https://nexterwp.com/docs/add-carousel-remote-in-wordpress/)- [Connect Process Steps with Carousel Anything](https://nexterwp.com/docs/connect-process-steps-with-carousel-anything-in-wordpress/)- [Add Carousel Anything in WordPress](https://nexterwp.com/docs/add-carousel-anything-in-wordpress/)- [Add an interactive circle in WordPress](https://nexterwp.com/docs/add-an-interactive-circle-in-wordpress/)- [Advanced tab settings](https://nexterwp.com/docs/use-advanced-tab-in-nexter-blocks/) ## Frequently Asked Questions **Q: What do I need before connecting Carousel Remote to a carousel in WordPress?** A: Carousel Remote only works when the Carousel Anything block is available in Nexter Blocks Pro, and both blocks are on the same page. The setup also depends on a published page, not the editor, because the pairing is made in the browser. A one-slide carousel is a bad test case since there is nothing to move to, so it can look broken even when the connection is fine. **Q: Why does my Carousel Remote do nothing after I set the ID?** A: The usual cause is an ID mismatch or a missing Pro activation. The page says the IDs must match exactly, including capitals, and the connection only appears on the published page. If the carousel still shows no response, that points to either Nexter Blocks Pro being inactive or the ID not being saved correctly. Re-entering the ID and updating the page is the practical fix when attributes never appear. **Q: Can one Carousel Remote control more than one carousel on the same page?** A: One remote can drive two carousels if they share the same ID, which is why each pairing needs its own unique value. Nexter Blocks uses the shared ID to create the connection in the browser, so duplicate IDs create duplicate control behavior. That matters most on pages with multiple sliders, where reusing an ID makes it look like one remote is linked to everything. **Q: Does Carousel Remote work in the WordPress editor or only on the live page?** A: It works on the published page, not in the editor. That matters because the pairing is created in the browser after publish, so you cannot reliably verify the connection while building. If something looks wrong in the editor, test it on the real page first before changing settings that may already be correct. **Q: Why do my carousel controls disappear on mobile after connecting a remote?** A: The remote and carousel can stack apart at smaller breakpoints, which makes them feel disconnected even though they are still paired by ID. The page recommends moving the remote directly above the carousel at the phone breakpoint. That keeps controls visible together on mobile, where separated elements are easy to lose during scrolling. **Q: What happens if I leave arrows and dots enabled on a carousel with a remote?** A: The carousel keeps its own controls unless you switch its arrows and dots off. That means you can end up with two control systems on one slider: the built-in arrows and dots plus Carousel Remote. The arrows and dots guide is relevant here because turning off local controls gives you a cleaner layout when you want navigation somewhere else entirely.