Is there a way to click a menu item on the Header Menu on the Service Portal and leave the clicked menu item highlighted?

[Mitchell Moses]

I am looking for a way to click the menu item and when the item redirects the user to a new page, the menu item clicked will be highlighted or be shown as a different color to show the user which tab they are on. I have tried the highlight and hover css attributes and they are good, but I need them to stay on after the page redirects

[Sumanth16]

Hi ,

Please refer to below link:

https://community.servicenow.com/community?id=community_question&sys_id=568ff6e9db58dbc01dcaf3231f96...

Please mark it as helpful (or) correct if it fixes your issue.

Thanks,

Sumanth

[Mitchell Moses · Accepted solution]

This didn't work for me and I used this which is way easier.

If anyone ever finds this, then use this https://community.servicenow.com/community?id=community_question&sys_id=10754faddbd8dbc01dcaf3231f9...

An issue i had with this was I tried to copy and paste his whole code and the menuCustom wouldn't run correctly because it doesn't include the href and other code so use this:

<a role="menuitem" ng-if="item.items.length == 0 && !item.scriptedItems" ng-href="" ng-click="collapse()" target="" title="" ng-class="{ 'active':item.href.indexOf('?id='+$root.page.id) >= 0 } ">
  <fa ng-if="::item.glyph" name=""></fa>
  <span ng-bind-html="::item.label"></span>
</a>

if you want to know how to copy the header widget in a scoped application then use this, but in the MenuCustom and spdrowdown.. only change what he tells you to change in the line of code and don't replace the whole line or it won't work

https://www.servicenowelite.com/blog/2018/11/15/clone-the-header-widget