Help center

Go to Topline
All collectionsSitesScroll to Elements or Sections in Websites or Funnels

Scroll to Elements or Sections in Websites or Funnels

Scrolling allows users to seamlessly navigate through content without having to click through multiple pages. It creates a fluid user experience by keeping information readily accessible and encourages engagement by presenting content in a visually appealing and digestible manner. By reducing the need for excessive clicks, scrolling can enhance user satisfaction and retention.

Quick Tips & How-to

  • In order to anchor/ scroll within the same funnel/website, you will need to use the CSS selector ID.

  • In order to anchor/ scroll to a section in another funnel/website page please use the page URL with the CSS selector ID appended at the end:
    Ex:     https://www.URL.com/funnelpath#CSS SELECTOR

Some common use cases to use anchor/ scroll to elements are:

  • Linking "Table of Contents" items to their corresponding sections

  • Linking "Terms of Service" for quick access to important sections 

  • Linking sections of your "scripts" for staff when handling prospects

  • Linking your "Navigation Menu" to the Pricing table that is located in a specific section of your funnel/ website

  • "Book a Call" button that links to a booking widget in another funnel or website

  • Specific Video located in a section of a funnel/ website

  • Multiple buttons to one section of your website/funnel like an opt in form etc.

How you would find your #CSS SELECTOR ID

1. Head into the Builder 

Click on the section you would like to anchor/ scroll too. Make sure the section or element is highlighted (green in this case). 

2. Click on Advanced in the Left Menu

Scroll down to the bottom of the right menu until you see CSS selector.

3. Click on CSS SELECTOR copy button

Copy text area titled: #heading-z9eiSSaU-k by clicking on the button

Hyperlinking the Text Element within the Build

1. Drag highlighted text you wish to link your section too.

2. Click on the "link" button

3. Paste "#heading-z9eiSSaU-k" into input field



Please Note:

info icon
To Anchor to another funnel/website section within your system please use the full page URL with the CSS selector ID appended at the end: Ex: https://www.URL.com/funnelpath#CSSSELECTORID.

Button - Website URL

1. Click on the button you wish to link a section too.

In this example we will be linking a button to a section from another page within the system.

Please proceed to click on the button. A highlighted box (orange) will appear when the button is selected.

2. Click on the dropdown menu located at the bottom of the left side.

Click on the dropdown menu located at the bottom of the left side menu.

3. Paste the URL plus CSS Selector in the input field

Next lets grab the page URL and append the CSS selector ID to the end.

Ex: https://www.URL.com/funnelpath#CSS SELECTOR

Using the Navigation Menu Element in the Builder

1. Click on NAVIGATION MENU Element

For this example we will anchor the "Home" option to a booking widget section located in another funnel/ website.

2. Click on the edit pencil next to "Home" located in the right side menu area.

3. Click on "Go to website URL"

Paste your redirect URL+CSS Selector: 
Ex: https://www.URL.com/funnelpath#CSS SELECTOR

4. Open link in New Tab

For this option if you would like to open the link in a new tab please toggle this feature on (blue). 

5. Click on Submit

Make sure so hit "Save", that's it!
Your Navigation Menu will now open your booking widget in a new tab.

Did this answer your question?
😞
😐
😁
RoadmapHomepage