---
title: "How to Link to a Specific Section in Elementor Horizontal Page Scroll?"
url: https://theplusaddons.com/docs/link-to-a-specific-section-in-elementor-horizontal-page-scroll/
date: 2023-03-17
modified: 2026-04-12
author: "Aditya Sharma"
description: "Do you want to link to a specific section of a horizontal scrolling section? So you can send users directly to that section. As websites continue to evolve, designers strive..."
image: https://theplusaddons.com/wp-content/uploads/2023/03/How-to-Link-to-a-Specific-Section-in-Elementor-Horizontal-Page-Scroll_-1024x536.jpg
word_count: 391
---

# How to Link to a Specific Section in Elementor Horizontal Page Scroll?

## Key Takeaways

- Horizontal Scroll widget from The Plus Addons for Elementor allows linking to specific sections of a horizontal scrolling webpage.
- Users can assign an ID to each section of the horizontal scroll using a pipe separator (|) without spaces.
- To link to a specific section, users must add the ID with # in the Link field of a button widget.

Do you want to link to a specific section of a horizontal scrolling section? So you can send users directly to that section.

As websites continue to evolve, designers strive to create unique and user-friendly interfaces that offer seamless navigation for visitors. Horizontal page scrolling stands out as an engaging way to display content on a website, especially for portfolios, product showcases, or feature pages. However, it can be challenging to direct visitors to a specific section of a horizontal scrolling webpage using a hyperlink.

This task might seem complex, but the Horizontal Scroll widget from The Plus Addons for Elementor, allows you to easily link to a specific section of your template.

*To check the complete feature overview documentation of The Plus Addons for Elementor Horizontal Scroll widget, [click here](/docs/horizontal-scroll-elementor-widget-settings-overview/).*

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

[LIVE WIDGET LINK](https://theplusaddons.com/elementor-widget/elementor-horizontal-scroll?utm_source=tpae&utm_medium=docs&utm_campaign=text)

To do this, add the widget on the page and your Elementor template in the **Content** tab.

Now you have to add an id to the section you want to link to in your Elementor template. 

There are two ways you can do that.

One way is to add the id within the template, select the section and, go to **Advanced** > **CSS ID**, add your id.

![horizontal scroll css id](https://theplusaddons.com/wp-content/uploads/2023/03/horizontal-scroll-css-id.png)

The second option is to select the Horizontal Scroll widget, and go to **Extra Options** tab > **Section ID**.

From here, you can assign an id to each section of the horizontal scroll. You have to use a pipe separator (**|**) without any space to add the id for each section.

Example: slide1|slide2

![horizontal scroll section id](https://theplusaddons.com/wp-content/uploads/2023/03/horizontal-scroll-section-id-1.png)

Once you’ve added the id to your section, go to **Extra Options** tab > **URL Parameter** and turn on the toggle.

![horizontal scroll url parameter](https://theplusaddons.com/wp-content/uploads/2023/03/horizontal-scroll-url-parameter-1.png)

This will allow you to add anchor links in the URL.

Now to link to that specific section use the id with **#**.

Let’s use a button widget to link. Add the ID with **#** in the Link field.

![button link id for horizontal scroll](https://theplusaddons.com/wp-content/uploads/2023/03/button-link-id-for-horizontal-scroll.png)

> *Note: If you link it from a different page within the same domain, make sure to add the page path before the #id. Like ****/service/#slide2****.*

Now if someone clicks on the button, it will take them directly to that specific section.

Also, check [How to Add Progress Bar in Elementor Horizontal Page Scroll](https://theplusaddons.com/docs//add-progress-bar-in-elementor-horizontal-page-scroll/).

## Frequently Asked Questions

**Q: What should I do if the section ID isn't linking correctly?**
A: If the section ID isn't linking correctly, ensure that you've added the ID properly in the Advanced settings of the section or in the Horizontal Scroll widget under Extra Options. Use a pipe separator (|) without spaces for multiple IDs. If the URL parameter toggle is off, the anchor links won't work, so make sure it's enabled.

**Q: What is the best practice for naming section IDs in Elementor?**
A: A good practice for naming section IDs is to keep them simple and descriptive, like 'slide1' or 'portfolio'. This makes it easier for you and others to understand what each section represents. Avoid spaces and special characters, and remember to use a pipe separator if you have multiple IDs.

**Q: What happens if I forget to enable the URL parameter toggle?**
A: If you forget to enable the URL parameter toggle, the anchor links won't function. This means that even if you set the section IDs correctly, clicking on the links will not take users to the intended sections, which can lead to confusion.

**Q: How can I enhance user navigation with the Horizontal Scroll widget?**
A: To enhance user navigation with the Horizontal Scroll widget, consider adding a progress bar as outlined in the [How to Add Progress Bar in Elementor Horizontal Page Scroll](https://theplusaddons.com/docs//add-progress-bar-in-elementor-horizontal-page-scroll/) guide. This visual aid helps users track their position within the horizontal scroll, improving the overall user experience.