Hey there,
as the title suggests, is it possible for me to achieve a sidebar following this particular’s website sidebar for reference: http://www20.hdb.gov.sg/fi10/fi10221p.nsf/arxvi/chairman.html
For Example: Sidebar Menu has 1a, 1b and 1c. When User is on Page 1b, the Sidebar hyperlink (1b) will be highlighted RED. While 1a and 1c will be as per normal, with effects of hover.
Website Url: http://leapdsc.com/leapdsc/client/hdb/chairmans-statement/
In this case, since user is on chairman’s statement Page, the ‘Chairman’s Statement’ hyperlink on the sidebar is to be in red color. Do take note: I have also tried a:visited, but it seems to highlight every page that the user has visited (not ideal).
Please advise if this is possible to be done on CSS. I have tried various methods such as xxxx .a:active {color:red}, however it does not seem to work.
Thank you
Hello,
Try to add this code in the theme panel-> custom css box:
.vc_widget_sidebar .current-menu-item a{
color:Red!important;
}
Thanks.
Hey there,
It works like a charm! Appreciate for the great help
Thanks!
Hey there,
Sorry as I seem to have discovered a minor error which I would like to fix.
I have checked and all the links are working fine. Except for a ‘Main header’ link as the current page, it would lead to the ‘sub-pages’ being active in a highlighted red link as well.
In this instance, as ‘Corporate Governance’ is the current page. However, the sub-pages under it are highlighted in the sidebar as well. Is there a way I can better control it to be as the rest?
Kindly follow the links below for your better understanding.
Website Error link: http://leapdsc.com/leapdsc/client/hdb/corporate-governance/
Image 1 (Ideal Scenario): https://1drv.ms/i/s!Ai3uwVtbSehuuLBxW86uPt7cPxCPiQ
Image 2: https://1drv.ms/i/s!Ai3uwVtbSehuuLBySqi4Df4THIG_Gg
Hi,
Try the code like this, it should provide the result you want
– https://www.screencast.com/t/iXHUMyPTW49
.vc_widget_sidebar .current-menu-item > a {
color: #ee3224!important;
}
Thanks
Hey there,
I have tried the code and it was working perfectly fine for a period.
However, till earlier today, it has suddenly stopped working.
Is there something that I am missing out? Or a coding issue within?
Please assist me on this.
Hope to hear from you soon. Thank you.
Hi,
Seems to be applying at the moment, from what I can see
– https://www.screencast.com/t/xqOCT517
It cannot simply stop working, unless something else might be cancelling it. A different custom code maybe.
Thanks
