How to Scroll to Elements or Sections in Websites or Funnels

To make an element scroll to a section, first copy the target section's CSS Selector from its Advanced tab. Then, for a button, set its Button Action to Scroll to Element and select the section, or for a link, paste the page URL followed by the CSS selector (e.g., `yourdomain.com/#css_selector`). This takes about 2 minutes.

• ✓Always copy the CSS Selector from the *destination* section's **Advanced** tab.
• ✓The "Scroll to Element" button action is the easiest method and doesn't require manual linking.
• ✓For text links or navigation menus, you must use the full page URL followed by the copied CSS Selector (e.g., `https://domain.com/page#selector`).
• ✓Smooth scrolling is enabled by default; you don't need to configure it.
• ✓This feature only works for scrolling on the *same* page, not between different funnel steps or website pages.

Step 1: How to Find and Copy the Target Section's CSS Selector

Before you can create a scroll link, you need to identify the destination. Every section, row, and element in the builder has a unique ID called a CSS Selector. This is the 'address' you will tell your button or link to scroll to. You must complete this step first, regardless of which method you use later.

Step 2, Method A: How to Make a Button Scroll (Easiest Method)

This is the simplest and most reliable way to create a scroll link for a button. It uses the builder's built-in functionality, so you don't need to paste any URLs or selectors manually. We recommend this method for all button scroll links.

Step 2, Method B: How to Manually Create a Scroll Link for Text

If you want to turn a line of text into a scroll link, you must use the manual method. This involves combining your page's full URL with the CSS Selector you copied in Step 1. This method also works for images and other elements that have a link option.

1

Highlight your text — In the page editor, click inside a text element and highlight the words you want to turn into a link. A small formatting toolbar will appear.

0

2

Open the link settings — Click the link icon in the formatting toolbar. A pop-up window labeled "Link" will open.

1

3

Enter the full page URL — In the URL field, you must paste the complete URL of the page you are currently on. For example, `https://yourdomain.com/sales-page`.

2

4

Add the CSS Selector — Immediately after the URL, paste the CSS Selector you copied in Step 1. The final result should look like this: `https://yourdomain.com/sales-page#section--12345`.

3

5

Confirm and save — Click the blue check mark icon to apply the link. Finally, click the main Save button in the top-right corner of the builder.

4

Step 2, Method C: How to Add a Scroll Link to a Navigation Menu

You can make items in your navigation menu scroll to different sections on the same page. This is perfect for one-page websites or long-form sales pages where the menu helps users jump to important content like pricing or contact information.

Troubleshooting Common Issues

Common Mistakes to Avoid

• →Forgetting to include the full page URL before the CSS selector for text and menu links.
• →Trying to use the scroll-to feature to link between different funnel steps or website pages (it only works on the same page).
• →Accidentally deleting a character from the CSS Selector when pasting it, which breaks the link.
• →Not saving the page after making changes and wondering why the live version isn't updated.
• →Testing the scroll link inside the page builder itself, where it is not active, instead of using the Preview button or live URL.

Frequently Asked Questions

Some links are affiliate links — if you sign up we may earn a commission, at no extra cost to you. We only recommend GoHighLevel because we build on it every day.