Display Order of Header Menu in Employee Center

Community Alums · ‎05-10-2023

I would like to change the order of the menus shown in the header menu of Employee Center, but I don't know how to do it.
Specifically, I would like to place "My favorites" and "Profile" to the right of "Tours".

If anyone knows how to change it, I would like to know.

RodGallegos · ‎05-11-2023

After further investigation it looks like there is an issue with the loading order of these menu items. At random refreshed of the page, the menu items would snap back to their OOTB order. So I took a bit more of a heavy handed approach. But I did get this to work consistently.

This is my cloned head widget:

CSS in the widget

End result

View solution in original post

RodGallegos · ‎05-10-2023

@Community Alums You have some flexibility using CSS. For example the CSS 'float' property specifies how an element should float. Check out https://www.w3schools.com/css/css_float.asp

For further customization, you will need to clone the widget and move the HTML code to the positions you'd like.

Best of luck!

Community Alums · ‎05-10-2023

Hi @Community Alums ,

You can clone the Employee Center Header widget and then make the following changes:

1. In the HTML Template of the widget, swap the list item (li) location of the Avatar and the Cart, tours, and wishlist.

2. Then add your newly cloned header widget to the theme:

Now, when you test this from the portal, it will trigger errors. You now have to allow new Restricted Caller Access Privileges for the new custom header.

Community Alums · ‎05-10-2023

Hi @Community Alums ,

Community Alums · ‎05-10-2023

Hi Sandeep,

Thank you for your response.

I tried changing the position, but when I access the portal, it appears in the changed order for a moment, then immediately reverts to the previous layout.
Is there anything else that still needs to be changed?