Questions on Employee Center global header

[Black Coder]

We have received the requirements to Add new menus and edit already available menus.

Question 1. Right now it is allowing us to add menus under the "more" option but we are in need to show the menus in normal view instead of under the "more" option.  How can we achieve that?

Question 2. How Can change the title of the already available menus and the order of the menus Ex - My Tasks, My requests

Question 3. How can we give the icons in front of each Menu title?

Below is the our current menus option

Below is the design we try to implement

 

[Dan O Connor]

@Jonathan Ting If you open your Portal record in the main platform UI and drill into the Main Menu record you are using. That is effectively the main asset for the header

You will also see a bit of Quick Start config in your portal showing you reference to the Favourite icon. 

But if you look into the Main Menu record, you will see a widget likely called ' Header Menu'. This is the widget controlling the EC Header

Here is where you can change the names of the existing Menu Items, and possibly look at making changes to Favourites. 

Also just remember if you add new Menu Items, which are not contained within 'More' they will not align correctly. So you will need to come back to this widget, define them, and then align them. 

[Jonathan Ting]

@Dan O Connor  I had a look at your suggestion, but it didn't make sense to me, the current menu item for favourites isn't there and why would I be creating an item if it's already exist? If you look at the 'Employee Center Header' widget, you'll see the menu items in the HTML, but the list item for the Favourites is missing ng-bind-html that every other item has.

I can confirm adding that missing line allows you to display the text, but the question is, was this an error or is it by design?

            <li class="gt-menu-item" role="presentation" ng-if="data.showRequests">
              <a href="?id=my_requests" id="cases_popup" aria-label="${My Requests}" role="menuitem"> <!-- TODO: Link for requests -->
                <span ng-bind-html="'${My Requests}'" aria-hidden="true"></span>
                <span ng-show="data.requestCount" class="label label-as-badge label-primary">{{data.requestCount}}</span>
              </a>
            </li>
            <li class="gt-menu-item" role="presentation" ng-if="data.isFavoritesEnabled">
               <a href="?id=favorites_list" id="favorites" aria-label="${My favorites}" role="menuitem" 
                  data-toggle="tooltip" title="${My favorites}" data-placement="bottom"> 
                 <i class="fa icon" ng-class="data.favoriteIcon"></i>      
           	   </a>         
            </li>

[Dan O Connor]

It is by design. Go back out to the Portal record and look at the Quick Start Config. You will see reference to the Favourites being called with an icon 🙂