Add Navigation Items to the Navbar
There are two types of navigational items that can be added to the Navbar: a Page and an External Link
Add a Page to the Navbar
A published page can be added to either the Tier 1 or Tier 2 Navigation bars:
Tier 1 - Primary Navigation Bar
The term tier 1 navigation refers to the hierarchy of the nav item. Tier 1 navigation is the highest level of navigation possible on the SCAS navbar. This navigation is immediately visible on all pages of the website and is used to navigate to landing pages for different sections (i.e. the “About” page/navigation).
To add a page to the tier 1 navigation, use the Strapi cms sidebar and under "Single Types" select "navBar".
Under the "label" component click "Add an entry" to begin.
Enter the name of the section that will be displayed on the live navbar (i.e. “About”, “Publications”, etc.) in the “label” text box.
Select the page that will be navigated to when the label is clicked on the navbar using the "page" dropdown.
The dropdown will display all available published pages.
Click "Save" at the top right to save your new tier 1 navigation label.
Wonderful! The new tier 1 navigation label and Page will be reflected on the live SCAS website in 1 - 15 minutes from saving.
New tier 1 nav label from strapi on the live website:
When the “Test Page” tier 1 label in the navigation is clicked we are directed to the Test Page:
Tier 2
The term tier 2 navigation refers to the hierarchy of the nav item. Tier 2 navigation is the lowest level of navigation possible on the SCAS navbar. This navigation is nested under the Tier 1 navigations and is only visible to the user after clicking on the arrow icons located next to each of the Tier 1 labels.
To add a page to the tier 2 navigation, use the Strapi cms sidebar and under "Single Types" select "navBar" and click the arrow located on the Tier 1 label line.
Select "Add an entry" to begin.
Enter the name of the navigation that will be displayed on the live navbar (i.e. "From the President", "Become a Member", etc.) in the "labelTwo" text box.
Select the page that will be navigated to when the labelTwo is clicked on the navbar using the "page" dropdown.
Warning: The "externalLink" text box is only for adding external links to the navigation. Follow along with the Add an external link to the Navbar section below. Please note having both a page and an externalLink for one "labelTwo" navigation is not supported!
Click "Save" at the top right to save your new tier 2 navigation label.
Wonderful! The new tier 2 navigation label and Page will be reflected on the live SCAS website in 1 - 15 minutes from saving.
New tier 2 nav label from strapi on the live website:
When the “Test Page” tier 2 label in the navigation was clicked we are directed to the Test Page:
Add an External Link to the Navbar
An external link (i.e. a PayPal donation link, membership joinit link, a pdf, etc.) can be added to the tier 2 navigation on the Navbar. The term tier 2 navigation refers to the hierarchy of the nav item, tier 2 navigation is the lowest level of navigation possible on the SCAS navbar. This navigation is nested under the Tier 1 navigations, only visible to the user when clicking on the arrow icons located next to the Tier 1 labels to then reveal the tier 2 labels.
To add an external link to the tier 2 navigation, use the Strapi cms sidebar and under "Single Types" select "navBar" and click the arrow located on the Tier 1 label line and select "Add an entry" to begin.
Enter the name of the navigation that will be displayed on the live navbar (i.e. "Scas Bulletin", "Donate", etc.) in the "labelTwo" text box. Enter the external link that will be navigated to when the labelTwo is clicked on the navbar using the "externalLink" text box. Click the “Save” button located at the top right and your changes will be reflected on the live SCAS website in 1 - 15 minutes from saving.
Warning: The “page” dropdown box is only for adding page navigations to the navbar, similar to the Add a page to the Navbar section above. Please note having both a page and an externalLink for one "labelTwo" navigation is not supported!
Live Scas website example:
Reorder and Delete Navigations
Deleting a Tier 1 Navigation
To delete a tier 1 navigation, locate the desired tier 1 line and click the trashcan icon.
Note: Deleting a tier 1 navigation will also delete any *tier 2 *navigations nested under the deleted Tier 1 label.
Click the “Save” button located at the top right and your changes will be reflected on the live SCAS website in 1 - 15 minutes from saving.
Deleting a Tier 2 Navigation
To delete a tier 2 navigation, locate the desired tier 2 line and click the trashcan icon.
Click the “Save” button located at the top right and your changes will be reflected on the live SCAS website in 1 - 15 minutes from saving.
Reorder Tier 1 and Tier 2 navigations
To change the order of the navigation labels on the website, go to Single Types > navBar component, click the 6 dots located to the right of the navigation line to drag and drop into a new order for both Tier 1 and Tier 2 navigations.
