One Page Site with Fixed Left Nav

Updated on December 19, 2020

This members-only tutorial provides the steps to set up a single-page website having fixed left navigation using CSS Grid in Oxygen.

We shall enable smooth scrolling for nav menu links.

Live Demo

Step 1

Create a Page titled say, "Home" and set it as homepage at Settings > Reading.

Step 2

Go to Appearance > Menus.

Create a menu named say, "Main Menu" having links to individual sections of your homepage.

Step 3

Create an Oxygen Template named say, "Main".

Set it as Catch All Template.

Edit it with Oxygen.

Once you finish implementing this tutorial you will have structure like this: