Academy Session
Introduction
We’re excited to introduce Simplified, Side Navigation to the Employee Center, which is a modern, streamlined navigation layout designed to simplify the mega menu and provide an experience on par with consumer-grade applications. This new layout emphasizes clarity, visual iconography, and quick access to key destinations, helping employees browse topics with less effort and reduced visual complexity. Simplified, Side Navigation has been added in addition to the existing top navigation layout, giving organizations the flexibility to choose the style that best fits their portal strategy. It is intended for organizations aiming for a lighter, more modern navigation style that avoids overwhelming users with too many choices.
Here are the key Features of the Side Navigation enhancements:
- Left Navigation with two-level structure - Displays a clean, flat left-side menu layout on the portal. Navigation supports up to two levels: Root item and Subtopic. This structure keeps content focused and reduces deep menu nesting. If a root item has no child topics, it displays as a simple single-level item for clarity.
- Predefined Icon Set - Admins can choose from a set of over 600 predefined icons available out of the box. Additionally, a default icon can be set to apply to all root menu items.
- Responsive layout for mobile screens – Provides a consistent experience across all screen sizes. When the screen width drops below 760px, the responsive layout automatically switches to a mobile-friendly bottom navigation bar. In this view, the Employee Center header, which includes the profile and shortcuts such as My Tasks and Requests, collapses into a compact hamburger menu for easier access.
- Smart overflow handling for menu - When there are more items than available space on either the left or bottom navigation, a ‘More’ menu automatically appears, preventing crowding the primary navigation area. Subtopic view appears through hover or click, making navigation feel light while still offering depth when needed. If a sub-menu includes many items, a scroll bar appears to help users move through the list effortlessly.
|
Side Navigation vs Top Navigation: Choosing the Right Layout for Your Portal
While the top navigation style continues to support deeper, four-level mega-menu structures and the ability to surface a broad set of topics upfront—including Quick Links—Side Navigation intentionally narrows the structure for clarity and ease of use. This streamlined design helps draw attention to the most important menu items through icons, something that is not currently supported in the top navigation. Organizations can now choose between Top Navigation and Side Navigation via Advanced Portal Navigation settings.
When choosing between the two navigation layouts, organizations should keep the following differences in each style in mind:
1. Content Hierarchy Depth: · Side navigation is optimized for a simple, two-level hierarchy (Root + Subtopic) · Top Navigation supports deeper, four-level mega-menu structures 2. Quick Links to highlight important shortcuts: · Side Navigation does not support Quick Links within topic menus. However, important shortcuts can be added as menu items instead. · Top Navigation can display Quick Links to highlight important shortcuts. 3. Visual Iconography: · Side Navigation uses icons to visually emphasize key menu items. · Top Navigation does not currently support visual iconography 4. Menu Item Arrangement: · Side Navigation allows admins to define the order of menu items, but alignment (left/right) is not applicable. · Top Navigation supports ordering and aligning menu items left or right to place emphasis on specific items. 5. Responsiveness on Mobile screens: · Side Navigation allows mega menu to transform into a mobile-friendly bottom navigation bar for smaller screens. · Top Navigation collapses mega menu items into the hamburger menu for smaller screens.
Side Navigation is ideal for organizations prioritizing simplicity, focus, and a modern, app-like experience; top navigation remains the better choice when depth, complexity, or broader topic visibility is needed.
|
Steps to set up a side-layout mega menu with Advanced Portal Navigation (APN):
- Create or update an APN record.
- Select Side Navigation as the navigation style and assign icons.
- Configure root topics and subtopics.
- Activate the APN record to apply the new navigation instantly.
How to get access?
License & family release compatibility – The Side Navigation for Employee Center functionality is available for all Employee Center customers and backward compatible with Xanadu patch 10, Yokohama patch 7, and Zurich patch 1 family release.
Plugins required – This capability is available by upgrading the Employee Center plugin (version 39.0.8).
Technical details – The Side navigation can be enabled by creating a separate record in Advanced Portal Navigation. In this record, the admins must define all menu items and assign corresponding icons for each item. An organization’s current information architecture can also be migrated to side navigation, which will automatically display only the first level of menu items.
Refer to Simplified, Side Navigation for Employee Center product documentation for additional details.
|
