One Page WordPress Site Style
In this tutorial on visualmodo knowledge base we will show how to create an One Page Site using our WordPress Theme in a simple and easy way and how to organize it with our themes.
This is an example of one page WordPress site layout http://theme.visualmodo.com/stream/
First of all you need to keep in mind that you need to have a page ready to use, for it you need to login on your WordPress dashboard, pages, add new, and using the theme pagebuilder apply ‘row / section’ on your page to separate the areas, for more information about how to use rows and pagebuilder sections please take a look on your theme documentation. With all the ready-made areas / sections the way you want we will start this tutorial. We will explain how to connect areas of your page rows / section with pages on your menu.
1 – To create your one page site system you need to go on your WordPress dashboard > Visualmodo > ‘Theme Options’ > ‘Header’ and found a option called ‘Do You Want Extra Menus?’ and type ‘2’ (we use only one on our theme demo http://theme.visualmodo.com/stream/) but you are free to use as much as you want. After select this info please click on ‘Save Changes’ Button.
2 – Go to Appearance area of your WordPress and click on ‘Menus’ tab, create a new menu, to place pages on this navigation menu click on ‘Custom Links’ tab and enter with your page name and on the url type ‘#′ this will organize your page when you go create it, to add a page on the menu click on add menu’ button, Make sure to apply each page with their own name.
By opening the menu item toggle make sure you type the caller code for this section on your lice page (to link the page section with the menu item so when your site url click on the menu link navigate to this area on the page) on Anchor area. For example: #feature or any other name (without spaces and starting with “#”.
And after apply your information to finish it you will need to save it as ‘Extra Menu 1′ or extra menu 2, this will call your menu when you go to add it on a page navigation header area.
3 – Go to your WordPress pages area, click on ‘all pages’ button and select your front page, click on ‘edit page’ button, scroll the page down until you see an area of ‘Options’ and found a option called ‘Change Menu’ under ‘Settings’ tab In this option select the extra menu that you create, in our page case it’s ‘Extra Menu 1′
4 – You will need to link this menus buttons with your page sections to be one page site, remember the Anchor of your page sections on the menu (like ‘#features′) and put it on a section area on the page builder ‘row editor’ window. To do it click on ‘Edit the Row’ button of the page builder section, a window will open to you enter with you menu name. in this case the menu name of this area is ‘features′ on the ‘Section ID or Row ID’ on the Section Settings or Row Settings area. You need to do it to link your page sections with your menu buttons, after it is all done.
You also can build the scroll down / one-page navigation style using a free plugin called Page scroll to id all Visualmodo WordPress themes works perfectly with it.
How to create an one page WordPress site style using our WordPress themes – By Visualmodo
Award-Winning 24/7 customer service
Everyone on our Customer Care team is an experienced Visualmodo user and works in our office. Nothing is ever outsourced.