One-Page Website?


#1

Hello
I’m trying to create a one-page-website but I failed until now.
I know how Blocs work with the navigation and inserting pages, but I need to know how to add a navigation-point/link that then scrolls down to the anchor/point.
Can anybody help?
Thank you
Bob


#2

Hi Bob,

Give the bloc you want to scroll to an ID, such as "anchor1"
Go in the menu manager and add a menu item.
Edit the menu item and select ’ Navigate to URL’ as type.
Add the URL such as “./index.html#anchor1”

Make sure to switch off the option ‘lazy loading’ when exporting your website.
Otherwise you might have the problem that the page jumps to the wrong position when loading.

See also: Scroll to target (bloc xy) - Beta 14


#3

Hi, thank you for input… works fine.
Only one thing that I don’t like … i’ve made a sticky navigation and the jump to anchor (different blocs) works but the header of the bloc is always disappear behind the sticky navigation.
How to solve?
thx
bob


#4

With a single page site you don’t need to specify a url, which reloads the page. Instead, try selecting the menu item on the page, then from the sidebar select ‘scroll to target’. Then you will be presented with a list of your bloc ids to select from.


#5

@ScottinPollock
Your approach works fine with (single) link fields but not when using the built-in menu function (I wish it would). Of course, one could simply design a menu by adding several link fields…

@Hotfox
Instead of linking it to the header of the bloc you want to show, why don’t you link it to an item above? If there is to much whitespace between the two, I would simply create an empty field above the content, give it an ID and link to that. Just my two cent…


#6

It’s a single page… create standard nav bloc, build the menu in menu manager, set its data source to none and then link the items in sidebar.


#7

That was the part I overlooked. Thanks!