htmlcsswordpresswoocommercestorefront

Woocommerce Storefront navigation menu active page color change

This is my website graceamaron.com

It was wordpress hosted site.

I have changed the primary navigation menu hover from default to #4fff51 by the below CSS.

.storefront-primary-navigation ul li a:hover {
    color : #4fff51;
}

And now I have tried to change active menu color by below code

.storefront-primary-navigation ul li a:active {
    color : #4fff51;
}

But it's not working, how can I fix it?

Solution

  • Your WordPress theme adds the class current_page_item to the li item that is active. So if you want to change the active page URL color in the nav menu use the following class:

    .current_page_item a {
    color: red!important;
}

    See screenshot to see it working.

    enter image description here