Scroll to Sections in GoHighLevel

/ CRM, GHL / By

How to Scroll to Elements or Sections in GoHighLevel

ClickUp users who move to GoHighLevel often want the same smooth scroll-to-section navigation they had in other builders. You can easily create this in your GoHighLevel funnels and websites by assigning custom IDs to sections or elements, then linking buttons or navigation menu items to those IDs.

This guide walks you step by step through setting up scroll-to-section behavior in GoHighLevel, so your visitors can jump directly to key content areas on a page.

Why Use Scroll-to-Section in GoHighLevel

Setting up scroll-to-section links in GoHighLevel improves user experience and helps guide visitors to your most important content without loading new pages.

  • Create single-page funnels with clear navigation.
  • Send users directly to opt-in forms or pricing sections.
  • Reduce friction and keep visitors on the same page.

All of this is done using simple IDs and anchor-style links within the GoHighLevel funnel or website builder.

Prerequisites for Scroll Setup in GoHighLevel

Before you start, make sure you have:

  • An active GoHighLevel account.
  • Access to a funnel or website page you can edit.
  • Basic familiarity with the GoHighLevel page builder interface.

The process is the same whether you are working in a funnel step or a website page.

Step 1: Add or Identify the Target Section in GoHighLevel

First, decide which part of your GoHighLevel page you want to scroll to when users click a button or menu item.

  1. Open the GoHighLevel dashboard and go to Sites > Funnels or Sites > Websites.

  2. Select the funnel step or page you want to edit, then click Edit to open the builder.

  3. Locate the section or specific element you want visitors to scroll to (for example, a form, pricing block, or FAQ section).

You will assign a unique ID to this section or element so that other elements can link directly to it.

Step 2: Assign a Custom ID to a Section or Element in GoHighLevel

Every scroll-to-section setup in GoHighLevel starts with assigning an ID. This ID acts like an anchor on the page.

  1. Click on the target section or element in the GoHighLevel editor.

  2. In the left panel, go to the Advanced tab.

  3. Find the field labeled CSS ID (or similar, depending on the current UI wording).

  4. Enter a simple, unique ID. For example:

    • pricing
    • contact-form
    • features

Do not use spaces; stick to letters, numbers, and hyphens. Remember this ID exactly, because you will need it for your buttons or menu links.

Step 3: Create a Button That Scrolls in GoHighLevel

Next, you can create a button in GoHighLevel that scrolls users to your target section when clicked.

  1. Add or select a button element on the same page.

  2. In the left settings panel, under the Button options, locate the Action or Link field.

  3. Choose the option to link to a URL (internal link).

  4. In the URL field, type a hash (#) followed by the ID you created in Step 2. For example:

    • #pricing
    • #contact-form

  5. Update the button text to something descriptive like “View Pricing” or “Go to Contact Form”.

When visitors click this button on your live GoHighLevel page, the browser will smoothly scroll down (or up) to the section with the matching ID.

Step 4: Add Scroll Links to the Navigation Menu in GoHighLevel

You can also add scroll behavior to navigation menu items in GoHighLevel, which is especially useful for one-page websites or funnels.

  1. Select the navigation menu element in the builder.

  2. In the left panel, open the list of menu items.

  3. Edit or add a new menu item, such as “Pricing”, “Features”, or “Contact”.

  4. In the Link or URL field for that menu item, enter the ID with a hash, just like you did for the button. For example:

    • #pricing
    • #features

Now, when someone clicks that menu item on your live GoHighLevel page, the page will scroll directly to the linked section instead of loading a new page.

Step 5: Test Your Scroll-to-Section Setup in GoHighLevel

Always test your scroll configuration before sending traffic to your GoHighLevel funnel or website.

  1. Click Save in the GoHighLevel builder.

  2. Use the Preview option or open the live page URL in a new tab.

  3. Click the button or navigation menu item you configured.

  4. Confirm that the page scrolls to the correct section with the ID you assigned.

If the page does not scroll, double-check:

  • That the CSS ID in the section matches the ID in your link.
  • That you are using the leading hash (#) in the button or menu URL.
  • That the button or menu item is on the same page as the target section.

Common Mistakes When Using GoHighLevel Scroll Links

When setting up scroll-to-section behavior in GoHighLevel, watch out for these frequent issues:

  • Typos in IDs: #Pricing and #pricing are not the same. IDs are case-sensitive.
  • Spaces in IDs: Avoid values like price section. Use price-section instead.
  • Wrong page: The button or menu must be on the same GoHighLevel page as the section ID.
  • Missing hash (#): Without the hash, the link will act like a normal URL and not trigger scroll behavior.

Advanced GoHighLevel Tips for Better UX

For more polished scrolling behavior in GoHighLevel pages, consider:

  • Sticky headers: If your header is sticky, ensure the target sections have enough top padding so they are not hidden behind the header when scrolled to.
  • Clear calls to action: Use scroll buttons to move users from hero sections directly to forms or pricing tables.
  • Consistent naming: Keep a simple naming convention for IDs like section-hero, section-pricing, and section-contact.

Where to Learn More About GoHighLevel Scroll Features

You can review the original product documentation for scrolling behavior directly on the official help portal: GoHighLevel scroll-to-elements guide.

For broader strategy, funnel structure, and implementation support that integrates smoothly with GoHighLevel, you can also explore consulting resources at Consultevo.

Summary: Smooth Scrolling in GoHighLevel

Using scroll-to-section navigation in GoHighLevel is a straightforward way to improve user experience and keep visitors focused on key content areas. By assigning a CSS ID to sections or elements and linking buttons or navigation items to those IDs with the # prefix, you can create a clean, modern single-page experience for your funnels and websites.

Follow the steps in this article each time you build a new page in GoHighLevel, and you will quickly standardize smooth scrolling behavior across all your projects.

Need Help With ClickUp?

If you want expert help building, automating, or scaling your GHL , work with ConsultEvo — trusted GoHighLevel Partners.

Scale GoHighLevel

“`