Current Page Menu Item Highlighted in Main Menu

Hello,

When the user clicks on a certain menu item on the main menu, then the menu item pointing to that page should be somehow highlighted (e.g. underline, different color etc.) so that the user knows which is their current page. For example:

if the user is on the Home page then:
Home Services Products Contact

if the user is at Services page then:
Home Services Products Contact
etc.

How can this be done?

Thanks in advance,
Yannis

Hello Yannis,

When the user clicks on a certain menu item on the main menu, then the menu item pointing to that page should be somehow highlighted (e.g. underline, different color etc.) so that the user knows which is their current page.

I would be glad to help you, but can you please provide a link to your website first in order to let me check your header?

Kind Regards, Roman.
aThemes Support

Roman hi,
Thank you for your reply. Unfortunately the website is under construction so the front-end is only available to back end users. If you would like to see it, I need to send you credentials. If that is not possible, then kindly let me know which file(s) or part of the code to send you.
Thanks again,
Yannis

Hello Yannis,

You can try to add this CSS code in Customize → Additional CSS section.

.current-menu-item a {
    border-bottom: 2px solid red;
}

You can replace red with any other color or color code, 2px is the thickness.

Please feel free to ask any other questions that you might have.

Kind Regards, Roman.
aThemes Support

Roman hi,

That was exactly what I was looking for!

Thank you so much!

Great, you are welcome Yannis! :slight_smile:

Kind Regards, Roman.
aThemes Support