From the sidebar select "Navigation"
Click "New Menu" in the top right corner of the screen.
Next, give your navigation entry a name. The navigation key will automatically populate and you will not be able to edit it.
Next, click the "+" Add Item button and then click on the "Menu Item Title" panel so that it will expand.
For each item you can set the following details:
Title - give your Nav Item a Title
URI - the link for a specific nav item i.e. /home, /about-us/our-vision, etc
CSS Class - used for styling on your Websites/App. Which is styling classed, and in other words basically a grouping of styles. Use this field to set specific classes for each nav item
Component - enable you to link a specific nav item to a front-end component. i.e if you have a home page link, you could have a HomePage React component you want to render when the specific nav item is active
New Window/ Tab - check the checkbox if this nav item must open in a New Window/Tab, in the browser
NOTE: You'll have more Navigation Item settings once you pull your data in your website/product. The above options are common items used for quick setup/editing.
How to sort your list of Navigation items
Simply select the item, drag and drop it in the relevant place, as well as nest them under each other if it is required. You can also delete an item at any stage by selecting the delete icon.
Once you've set the relevant menu items and their information, as well as sorting them as required, select to "Save"
Now you're all set to hookup your Front-end and release to production.