Navigation development on Lancaster Students’ Union Website

Union Cloud Custom Navigation Development

This work was developed on the Union Cloud Content Management System for Lancaster University Student’s Union.

Development of bespoke styles to make the main navigation work on mobiles and add menu text quotes to each menu section.

This shows the final menu screenshot that includes the menu quote text.

It has also been updated to:

• Indicate where you currently are within the menu (example shows the events section)
• Added the menu quote text to work on mobiles too (see below)
• Updated the fonts and added font awesome icons
• Added the background colour
• Arranged the menu items in a vertical list (changed from a horizontal list)

Below is a screenshot of the original menu.

It has no indicator showing where you are and the menu items were listed horizontally making it hard to read.

Here is a screenshot showing the improved mobile menu that includes the menu quote text.

Original Website

Below shows the original  menu on a mobile when you clicked a top level item.

None of the sublevel menu items were clickable and they appeared over the top of the main menu when they were clicked.