About the Color of Header

Hi there,

I want the part in the screenshot to become #f9bf39 when hovering, could you please help me?

Regards

Attachments:

You must be logged in to view attached files.

Hello,

Please use the below custom CSS code and paste it to Theme Settings >> Custom CSS >> Global CSS:

.whb-main-header .menu-item span.nav-link-text:hover {
    color: #f9bf39;
}
.whb-top-bar .wd-tools-element .wd-tools-text:hover {
    color: #f9bf39;
}

Best Regards.

Great, thank you so much, but i got an another trouble:
I have followed the tutorial provided by you and achieved the desired effect, but I think it seems to have lost something.
For example, if my current page is “shop”, it should be highlighted or activated. The “shop” should be yellow(#f9bf39) at this time.
I don’t know how to describe it in detail, I hope you can understand what I mean, plase check the attackment of screenshot.

Regards

Attachments:

You must be logged in to view attached files.

Hello,
I think I have achieved what I want through the following CSS:

.wd-nav[class*="wd-style-"]>li.current-menu-item>a, .wd-nav[class*="wd-style-"]>li.wd-active>a {
	color: #f9bf39;
}

But I find that it is only effective for secondary pages, but it seems to have no effect on tertiary pages, such as product pages.

Attachments:

You must be logged in to view attached files.

Hello,

We are glad that you found the Custom CSS to achieve what you required.

It is not working for the product pages because it only highlights the items that are added in the main menu.

And the products are considered as separate pages, not the Shop page.

Regards.
Xtemos Studios

[Author]

Posts