How To Set Up A One Page Site

Avada gives you the flexibility to create a modern one page site with a scrolling menu. To get an idea of how one page sites work and look, please see our Landing Product demo here. A one page site lets you consolidate all your site』s information into one page that』s split into multiple sections. Please read below for detailed information on how to set it up.
Creating Content For One Page SitesWhen creating content for your One Page site, you』ll need to organize your content into sections and use the 『Name Of Menu Anchor』 option present in the Container Element or the Menu Anchor Element at the beginning of every section. This is so you can reference each section in your menu. Your menu will serve as a way for your viewers to quickly scroll to a section they』d like to view. For example, clicking the About menu item will automatically scroll the page to the About section.
Step 1 – Create a new page or edit an existing one.
Step 2 – Click the 『Use Fusion Builder』 button to access the Fusion Builder, then create your page content and layout as normal.
Step 3 – Once you』re finished laying out the page and creating your content, determine the different sections on your page. For example, the About section, the Contact section, and the like.
Step 4 – Once you』ve decided on the different sections of your page, it』s time to reference each section. If your section is in the beginning of a Container Element, Use the 『Name Of Menu Anchor』 option in the Container Element. If your section is in the middle of a Container, use the Menu Anchor Element.
Step 6 – If you』re using the 『Name Of Menu Anchor』 option, then simply insert the unique Menu Anchor ID for the section. If you』re using the Menu Anchor Element, click the 『Element Settings』 and enter a unique Menu Anchor ID for the section in the 『Name』 field. For example, about.
Step 7 – Click 『Save』 to save your changes, then repeat steps 4-6 and create separate Menu Anchors for all the different sections that you have.
Custom MenuA Custom Menu is important because this is how your viewers jump to different sections of your page. Instead of normal links, your One Page site』s custom menu will have Anchor Links that link and scroll automatically to each section on the page.
How To Create A Custom MenuStep 1 – Navigate to the Appearance > Menus tab on your WordPress admin panel.
Step 2 – Click the 『Create A New Menu』 link. Give it a name, then click the 『Create Menu』 button.
Step 3 – In the left sidebar, expand the 『Custom Links』 tab. If you』re missing content types in the left sidebar that you want to add to the menu, you can open the Screen Options and enable them for your menu.
Step 4 – In the 『URL』 field, enter the Menu Anchor ID you』ve assigned to a section on your page. For example, if this menu item links to your About section, then it would be about. Please note that you have to enter it with a hashtag (#) in order to scroll to the section properly. For example, #about.
Step 5 – Once you』ve added the Anchor Name ID to the 『URL』 field, enter a name for the 『Link Text』 field. This is simply the menu item』s text. For example, About.
Step 6 – When finished filling in those fields, click the 『Add To Menu』 button.
Step 7 – Repeat steps 4-6 and create a menu item for each section you have.
Step 8 – Under the 『Menu Structure』 section, you』ll find all the menu items you』ve just created. You can expand each menu item and edit its settings if you need to.
Step 9 – Don』t forget to assign your new menu. To learn how, see 『Assigning A Custom Menu To A One Page Site』 and 『Assigning A Custom Menu To A Multi-Page Site』 below.
Step 9 – Once you』re done creating your custom menu, click 『Save Menu』.
IMPORTANT NOTE: If you want to create a link that lets the page scroll back up to the top, you can simply use #home, as this anchor is already preset in the theme.Assigning A Custom Menu To A One Page SiteStep 1 – If you』re creating a One Page site, you can assign a custom menu by going to the Appearance > Menus tab.
Step 2 – Select the custom menu you』ve just created from the dropdown, then click 『Select』 to load it.
Step 3 – Once you』ve loaded your custom menu, go to the 『Menu Settings』 section and check the 『Main Navigation』 checkbox. This will assign the custom menu you』ve created as your One Page site』s main menu.
Assigning A Custom Menu To A Multi-Page SiteStep 1 – If you』re creating a page similar to a One Page site on your Multi-Page site, you can assign a custom menu to it by editing the page.
Step 2 – Underneath the editor field, you』ll find the Fusion Page Options box.
Step 3 – Switch to the 『Header』 tab and locate the 『Main Navigation Menu』 option. In the dropdown field, select the custom menu you』ve just created. This will make your custom menu the menu for the Landing Page only.
Step 3 – Once finished, click 『Save Draft』 or 『Publish』.