Published on Aug 30, 2019

One Page Site with Fixed Left Nav

Sridhar Katakam

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:

This is a premium members-only content.

To view the rest of the content, please sign up for membership ($47/month or $499 one-time).

Already a member? Log in below or here.

tagschevron-leftchevron-rightchainangle-rightangle-upangle-downfolder-omagnifiercrossmenuchevron-downarrow-right