Web Development

Site Navigation (Menu)

The site navigation allows users to easily navigate website.

Example of Left Navigation:

left Navigation

Example of Horizontal Navigation:

Horizontal Navigation

 

The navigation block is automatically created in Cascade.  When users want to add items to the navigation, they must set the Display in Navigation button to ‘Yes’ in the Edit mode of Content Page or Folder.

Editing contents that can be viewed on navigation bar or not.

Any changes made to the navigation include file requires republishing it.  Refer to the "Publishing to Navigation/submit to workflow" instruction in the section below.

Cascade folder/page name is different from the Display name, Cascade Folder/page name represents the name in the URL.
Display name is what's shown on the navigation on the browser.
If you like to display the "Display Name" in Cascade site content section please follow these steps otherwise you may pass this section:

Account Settings

 

Allow Display Name

There are two types of Navigation in Cascade:

  1. Left Navigation: This is the default Navigation setup for all sites.
    left navigation
  2. Horizontal Navigation: If you wish to apply this type of navigation you must set it up at the beginning. If you have a left navigation and you wish to switch to Horizontal Navigation please submit a request to the IT Web Team.
    Horizontal Navigation

To create a dropdown menu, follow these steps:

  1. Create a Container Folder: Begin by creating a container folder for the menu items. Make sure the folder name matches the text you want to display in the dropdown.  For step-by-step guidance on creating a new folder, visit the Create Folder page.

  2. Sublevel Menu Support: Keep in mind that Cascade supports up to one sublevel menus.

  3. Enable Dropdown: In the folder's Edit form, enable the Make Dropdown option by setting it to Yes.

    Edit Folder properties to enable dropdown

  4. Include Content Pages: Ensure that the Display in Navigation option is selected for all content pages within the folder. This will include them in the dropdown menu.

If you want to reorder the submenu items, please refer to the "Navigation Ordering" section

 

In the header, select 'Order' to organize the pages in numerical order starting with 1 to how many pages you have.

Folder view with the "Order" highlighted in red

The example below shows the pages and folders ordered from 1 to 6:

Folders and pages ordered from 1 to 6

There are two other ways to organize pages in folder view: manually dragging the folders, and moving it up and down with the check-box. This can only be done  after you click on 'Order' in the header.

1. Manually Drag Method
After selecting 'Order', you can click on the folder or content name and manually drag it to the preffered location. The example below shows the 'img' folder moved down to order number 6 and the 'folder' folder is now order number 3.

Rearranged folders. 'Img' folder is now order number 6 instead of number 3

2. Check-Box Method

On the left side of the content page, check off which page you would like to adjust the order location.

Check off which folder to move and select the arrows to move up or down the list.

When a content page or folder is selected, four different arrows will appear in the header. These arrows allow you to adjust the position of the page or folder within the list:

Four selectable arrows: Move to top, move up, move down, move to bottom

Rearranged folders. 'Img' folder is now order number 6 instead of number 3 

WATCH VIDEO ON REORDERING THE NAV ITEMS

After rearranging the content pages to the preffered order, you need to publish the site-navigation file in the inc folder so your changes are saved and live.

Navigation File

For step-by-step instructions on how to publish a file please visit the Submit Content Page.