How To Use Elementor Widgets To Navigate Through Carousel Widget Slides

Today, we are happy to introduce a new feature to our customers. Now easily you can create custom navigation elements to navigate through the Elementor Carousel widget with any element button, image, icons, Lottie animation, etc.

Requirements:

  • You will need Premium Addons free plugin installed and activated on your website.
  • Also, make sure that this widget/feature/addon is enabled so you can find it in the Elementor editor
  • Premium Addons works only with Elementor Page Builder plugin so you will need to have it installed and activated as well.
  • Drag and drop Elementor carousel widget to the page.
Elementor Carousel Widget
Elementor Carousel Widget
  • Navigate to widget settings -> Content Type -> select Repeater option.
Set Elementor Carousel Content Type to Repeater
Set Elementor Carousel Content Type to Repeater
  • Select the Elementor Template that you want to insert inside the carousel. For further information about creating a template for Elementor, please check this article.
Select Elementor Template in Elementor Carousel Widget
Select Elementor Template in Elementor Carousel Widget
  • Assign an ID for the template. For example #slide-1 from Custom Navigation Element Selector option. We will use this ID in element CSS ID to link between elements and carousel slide.
Assign ID to Elementor Template Used with Elementor Carousel Widget
Assign ID to Elementor Template Used with Elementor Carousel Widget
  • Insert the element you want to use to navigate through the carousel slides. We will use a button in this case. All you need to do is navigate to widget settings -> Advanced tab -> insert a CSS ID that we added before in Custom Navigation Element Selector, in my example its “slide-1“.
  • Please make sure that IDs are inserted without the hash ‘#’.
Assign ID to Elementor Element
Assign ID to Elementor Element for Premium Carousel widget navigation

Now everything is settled up and you will be able to navigate through the carousel slides using any elements on your page.

Premium Carousel Widget Custom Navigation
Premium Carousel Widget Custom Navigation

If you still need any further assistance, feel free to contact Premium Addons support team from here. The team would be more than glad to help 😁

Related Docs:

Download Now it's free!

Extend your Elementor Page Builder capabilities now with Premium Addons. 20+ Elementor Widgets Totally Free of charge.

×