How to create Single Page website using twenty seventeen theme: Click on menus and it will scroll to the target/related content without refreshing
March 15, 2017 4 Comments
Before i shared you CSS customization of Twenty Seventeen theme. Today I am sharing you how to create Single Page Website using Twenty Seventeen Theme.
In Single Page Website, when you will click on menus, it will go scrolling to the related point or content in homepage.
You can use my shared method and ask question in the comments section.
Or can take my personal help.
Here are the Steps.
1. Install Page Scroll to id plugins. This pluigns will help us to scroll or go to the targetted / related content in homepage with an scrolling effect.
2. For simplicity lets assume our page will have only 3 menus : “Home”, “About” and “Contact”. When Clicking on “About” and “Contact” menu it will scroll to About and Contact section in Homepage.
3. Creating Pages for Single page Site in twenty Seventeen theme:
To Create the pages for single page website you have to wrap the Title with a little html like the image attached
<span id=" any id you use"> </span>
4. Adding Created page in Menu to scroll
5. How to show the Created page in Homepage in Twenty Seventeen Theme?
At First go to Appearance > Customize and the Twenty Seventeen theme Customiztion section will appear
Check the image attached how to add About Us page to show in homepage
Viola you are done 🙂
now Click on About Menu and you will see it is scrolling down and showing the About us Content
If you have any issue feel free to ask me question here in comments section
Want me to help you personally for CSS Issue?CLICK HERE….