Navigation Menu Hover Colour Change

Hi there,

In my site, the navigation menu along the top bar (That lets me browse to my different pages and is located beside the branding/logo) has text that changes colours when I hover over it with my mouse. However, the dark blue colour the text changes to when I hover over it (along with the horizontal bars that go in opposite directions on top of and below the text) blend in with my background colour. How can I change just the colour of the text (and horizontal lines above & below text)after I hover over it? Can I achieve this through custom CSS?

Hello,

You need to share a link to your site so we can prepare custom css code if possible.

Best Regards!

Hey there, immunitech.ca is my site.

Hi again,

Yes, you can achieve that with custom css code below:

/*navigation hover color*/
.main-navigation a:hover {
    color: #ffcc00;
}

/*navigation lines color*/
.main-navigation li a::after,
.main-navigation li a::before {
    border-color: #ffcc00;
}

Just change color to your liking. You can apply the code with a css plugin like this one https://wordpress.org/plugins/simple-custom-css/

All the Best!

Awesome! That worked great. Thank you. Could you also provide me with custom CSS to allow me to enter my own copyright text information, where the “Powered by WordPress: Theme Astrid by aThemes once was?” I used custom CSS

.site-info.container {
display: none;
}

To get rid of it.

Hi again,

You are hiding entire footer bottom sections with that code. Remove that code:

.site-info.container {
    display: none;
}

and use this one instead:

.site-copyright a,
.site-copyright span {
    display: none;
}

.site-copyright {
    visibility: hidden;
}

.site-copyright:after {
    display: inline-block;
    visibility: visible;
    content: "Your copyright info";
}

and set Your copyright info text string to your liking.

Note that you cannot add link in this way, and this is not considered a good practice but it will do the job and result should look like this http://screencast.com/t/hnyqmFDhFTY . In case that you want to achieve this in proper way, use child theme and edit footer.php file and contact info from there.

All the Best!

Perfect! That worked. One last question I swear… Is there a way to make the icons for my Facts widget on my homepage appear in a different colour? Right now they are colour 273755 and it blends in with the background so you can’t see the icons. The icons are called fa-clock-o and the other follow similar naming conventions.

Hi again,

Of course, use custom css code below and set color value to your liking:

.fact .fa {
    color: #ffcc00;
}

All the Best!