Menu Colour
Question

Hi All,

I want to make a menu in the top menu, that are company, knowledge management and UAM. And then, like when we are in company page, the company tab menu will have a blue color, if we are in knowledge management, the knowledge management tab menu will have a blue color. so, how to make the color for the tab menu can change based on page where we are in? and I want to ask, how to make a sub menu in the top menu? btw, i'm make traditional web application.

Thanks 

Regards,

RKT

Champion
Solution

Hi Riesta,

1) You can add following CSS in your application theme stylesheet.(added Screen shot).

.header .Menu_TopMenu.Menu_TopMenuActive {
  background: blue;
 }

2) To Add Submenu inside menu, Go to UI Flows -> Common -> Menu web block and add submenu inside MenuSubItems placeholder as below

Hope it Works, Thanks ;)

hi Shweta Gedam,

Thank you for your reply and sorry for the very late reply from me. :)

I want to ask, from your answer in no.1, is it only for in the sub menu? because I want to make it in the button too. like in 1 page, there are 2 button, named approve and need approval. each button will show their each container. so, when we click approve button, the approve button will become blue color, and the need approval button will become white color. But when we click need approval button, the button will change to blue color, and the approve button will change too white color. 

Thanks

Regards,

RKT


Champion

Hi Riesta,

  1. You can create a Integer local var named as 'ButtonValue'(default value = 0) 
  2. On click of Approve button action, Assign ButtonValue = 1 and Ajax refresh both buttons.
  3. On click of Need Approval button action, Assign ButtonValue = 2  and Ajax refresh both buttons.
  4. On Approve button extended properties, write CSS as below,

5. Same for Need Approval button properties, 

style : if(ButtonValue = 2, "background:blue","background:white")

Hope this helps, Thanks 

Champion

you can also do this using Javascript, let me know if you want to use Js.

For Js, Paste the following script in your screen javascript

"<script type=""text/javascript"">
if(document.getElementById('#" + Approve.Id + "').clicked == true)
{
   $('#" + Approve.Id + "').css('background', 'blue');
    $('#" + NeedApproval.Id + "').css('background', 'blue');
}

</script>"

Hi Shweta Gedam,

woww
it's work using this. thank you so much for your help


Regards,

RKT

Champion

Welcome, Always happy to help.

Happy Coding :)

Hi Shweta Gedam,

I want to ask, if I put the CSS in extended properties, when we click the approve button, the color of the approve button will change to blue color right? Nah, I want to make the font color change too. like, if the button turn to blue color, the font in that button will change to white color. if the button turn to white, the font color will change to black color. 

can't I make it like this ?

If(buttonValue=1,("background:#015daa","font:white"),("background:white","font:black"))

Thanks

Regards,

RKT

Champion

You can also do this in this way,

If(ButtonValue=2,"background:#015daa; color:white","background:white; color:black")


Hope this helps, Thanks :)

Hi Shweta Gedam,

Wahh
it's work. thank you so muchh :)

Regards,

RKT

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.