A one-page website sometimes called a single-page website is a website that is completely made from one page. It has no additional pages, all the information from the website are displayed on one page, so the user has to simply keep scrolling down to see the whole content.
To achieve that result, we can use anchor links. Once your page has opened, select the Edit with Elementor option. For each section on the page, you can add the ID which will be used to create the anchor link. To do this, simply right-click inside the section and select Edit Section. Inside the Advanced tab we can find the CSS ID field, where we can enter the section name.
Note that Elementor adds the hash key (#) automatically to the code, so there is no need to use it in front of the ID you enter. Just insert the ID name that you want to use.
For example, on this page we included the following sections:
These are the sections that we want our menu to refer to.
After we added the sections IDs, we can create the menu and add the menu items to our new menu. We can do that by clicking on the Create a new menu inside Appearance > Menus:
After that we can start adding the custom links to our menu:
In the URL field, enter the website’s URL followed by a hash sign (#) and the corresponding ID to create the slug for each section. The Link Text field is used for menu title as you would like it to appear on your website.
So, for our first section from the example, prices, the Custom link would look like this:
Once we’ve finished creating our menu items, we’ll assign the menu to the location where we want to display it and click Save to save this menu:
This option will provide you with more autonomy in handling your One page navigation. However, if you need any further assistance, you can always contact our support team via the Help Center.