How to Add Next /Previous Button in Elementor Horizontal Page Scroll?

Key Takeaways

  • The Plus Addons for Elementor includes the Horizontal Scroll widget and Carousel Remote widget for adding navigation buttons.
  • Users can customize button positions and texts in the Prev/Next tab of the Carousel Remote widget.
  • A unique connection ID is required in both the Horizontal Scroll widget and Carousel Remote widget to enable navigation functionality.
Table Of Content

Do you want to add a next/previous button to an Elementor horizontal page scroll to provide an easy navigation option to your users?

 In today’s digital landscape, website design and user experience have become critical aspects of online success. A website with an intuitive layout, engaging content, and easy navigation can enhance the user experience. Creating a Horizontal Page Scroll in Elementor is a popular design option, but navigating the section can be difficult for some users.

To provide a better user experience, you can add a next/previous navigation button to your horizontal scrolling section. With the Horizontal Scroll widget and Carousel Remote widget from The Plus Addons for Elementor, you can easily add a next/previous navigation button in your horizontal scrolling section.

To check the complete feature overview documentation of The Plus Addons for Elementor Horizontal Scroll 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.

For this process, first, drag and drop the Carousel Remote widget and the Horizontal Scroll widget, and then follow the below steps:

1. In the Horizontal Scroll widget, once you’ve added your Elementor template, go to Extra Options tab > Unique Connection ID. Add a unique id.

Horizontal scroll unique connection id

2. Now select the Carousel Remote widget, then go to the Content tab, add the same ID in the Unique Connection ID field, and make sure Remote Type is selected as Horizontal Scroll.

Carousel remote unique connection id horizontal scroll

3. Go to the Prev/Next tab and turn on the Next/Prev Button toggle. This will add a next previous button in the horizontal scrolling section. 

You’ll find some customisation options for the buttons. From Position Y and Position X, you can position the buttons. You can change the button texts from Button 1 Text and Button 2 Text fields. You can also add icons to the button from the Icon Style dropdown.

Carousel remote unique horizontal scroll prev next

Now users can easily navigate the horizontal scrolling section with the buttons.

Also, check How to Add Dots Navigation in Elementor Horizontal Page Scroll.

About the Author

Photo of Aditya Sharma CMO of The Plus Addons for Elementor
CMO · The Plus Addons for Elementor · 10 years experience

He has spent years in the WordPress ecosystem building, breaking, and optimizing sites until they actually perform. He works at the intersection of speed, growth, and usability, helping creators ship websites that load fast and convert. An active WordPress community contributor sharing through tools, tutorials, and direct collaboration. Tested practice, not theory.

WordPressElementorn8nAIClaudeAutomationServer
Get Instant Answers to all your questions about The Plus Addons for Elementor, trained on 1000+ Docs and Videos

Related Frequently Asked Questions

What should I do if the next/previous buttons are not showing up in my Elementor horizontal scroll?

If the next/previous buttons are not appearing, ensure that you have enabled the button toggle in the Prev/Next tab of the Carousel Remote widget settings. Additionally, confirm that the Unique Connection ID in both the Horizontal Scroll and Carousel Remote widgets matches. This ID is crucial for linking the two widgets together.

Is it possible to use the next/previous buttons with other page builders besides Elementor?

The next/previous buttons feature is specifically designed to work with Elementor and is part of The Plus Addons for Elementor. It does not support other page builders like Gutenberg, Beaver Builder, or Divi. Make sure you are using Elementor to implement this feature.

What are the best practices for positioning the next/previous buttons in Elementor?

For optimal user experience, position the next/previous buttons where they are easily accessible, typically at the center or sides of the horizontal scroll section. Use the Position Y and Position X settings in the Carousel Remote widget to adjust their placement. This ensures users can navigate smoothly without confusion.

Are there any limitations when using the next/previous buttons in Elementor horizontal scroll?

One limitation is that the next/previous buttons only function within the context of the Horizontal Scroll widget from The Plus Addons for Elementor. If you have multiple horizontal scroll sections, each will require its own Carousel Remote widget with a unique ID to function correctly.

What happens if I forget to set the Unique Connection ID for the Carousel Remote widget?

If you forget to set the Unique Connection ID in the Carousel Remote widget, the next/previous buttons will not control the Horizontal Scroll widget. This ID is essential for establishing the link between the two widgets, so ensure they match to enable proper functionality.

Last reviewed: April 11, 2026