Skip to content

How to connect a Carousel Remote Sync (Dots & Arrows) with Elementor Blog Posts Carousel?

Table Of Content

A blog carousel keeps recent posts compact, but the widget’s own navigation is not always where a design calls for it.

The Carousel Remote widget from The Plus Addons for Elementor gives a Blog Listing carousel its own Next/Prev buttons and dots, placed wherever you like. The two widgets are linked by the same ID.

To check the complete feature overview documentation of The Plus Addons for Elementor Carousel Remote widget, click here.

Requirement – This widget is a part of The Plus Addons for Elementor, make sure it’s installed & activated to enjoy all its powers.

Before You Start

  • Edition: Pro — the Carousel Remote widget is part of The Plus Addons for Elementor Pro. No free equivalent exists.
  • Widget to enable: Carousel Remote, switched on under The Plus Addons > Widgets.
  • A Blog Listing widget with its content ready, set to a Carousel layout.

Step 1: Set the Layout to Carousel

  1. Select the Blog Listing widget, choose your post query, then in Layout click the Carousel icon.
The layout icon picker of the blog listing widget with carousel selected

Step 2: Give the Carousel an ID

  1. Open Style > Carousel Options (or Content, depending on the widget) and type an ID into Unique Carousel ID, for example plans. Use letters, numbers, dashes or underscores, without spaces.

Step 3: Link the Carousel Remote

  1. Drag the Carousel Remote widget to where the controls should appear.
  2. In Content, type the same ID into Unique Connection ID.
  3. Leave Remote Type on Carousel (the default).
The unique connection id and remote type fields of the carousel remote widget

Step 4: Choose Buttons, Dots or Both

  1. Open Prev/Next. Next/Prev Button is on by default.
The next/prev button switch in the prev/next section of the carousel remote widget
  1. Open Dots and turn on Dots (off by default).
  2. Add one dot item per slide, in the same order as the slides.
The dots switch and dot items in the dots section of the carousel remote widget

Publish the page and try the buttons and dots on the front end.

The carousel remote widget's next, prev and dot controls next to a connected carousel on the front end

How It Behaves

  • Next and Prev move the connected carousel one slide.
  • Clicking a dot jumps straight to the matching slide and marks that dot active; moving the carousel by any other means (drag, autoplay) also updates which dot is active.
  • Verified on the front end with 8 slides: Next moved slide by slide (0 -> 1 -> 2 -> 3), Prev moved back, and each dot jumped to its own slide. With only as many slides as the carousel shows at once, Next/Prev have nowhere to go, so add more slides than the widget’s column count if the buttons look inactive.

Limitations

  • Dots are matched to slides by position and count. Add one dot per slide; a mismatched count leaves some slides with no dot of their own.
  • Carousel Remote is part of The Plus Addons for Elementor Pro only.

Troubleshooting

The buttons or dots do nothing

  • Check that Unique Carousel ID and Unique Connection ID match exactly, with no extra spaces.
  • Make sure Remote Type is set to Carousel.
  • If the carousel shows all its slides at once (few items, many columns), Next/Prev has nothing to advance to — add more slides.

Related Docs

Related Frequently Asked Questions

Related Docs