Footer Text Hover Colour

Hi,

I’m trying to change the footer text hover colour but haven’t had any luck so far. I’ve tried some of the CSS in these forums but unfortunately nothing seems to have done the trick.

Any guidance would be very much appreciated.

Best,
Chris

Hi Chris,

I hope you are well today and thank you for your question.

You can try achieving this by adding the following CSS code in the Custom CSS option of the latest version of Sparkling theme on the below path.

Admin Area -> Appearance -> Customize -> Sparkling Options -> Other -> Custom CSS

#page #footer-area a:hover {
    color: #983333;
}

Please change the color value in the above code to whatever you want to use by referring the following pages.

http://www.w3schools.com/html/html_colors.asp
http://www.w3schools.com/html/html_colorvalues.asp
http://www.w3schools.com/tags/ref_colorpicker.asp

Best Regards,
Movin

Hi Movin,

Thank you for reverting so quickly. I’ve tried the code but unfortunately it doesn’t look like it has worked.

Best,
Chris

Could you please share me your site URL where it is not working so that i can troubleshoot it?

Hi @movin,

I’m afraid that our site is not yet live so please find temporary login details below:

Site: http://www.quipmo.com
UN: Colorlib
PW: NNWsxaNhrITd^!!s!eeKeT

Any help would be most appreciated.

Best,
Chris

To make the above shared code work on your site please try changing it as following.

#page #footer-area a:hover {
    color: #983333 !important;
}

Perfect, thanks @movin - works a treat!

I’m not sure whether I need to open up a new thread or not but is there a way to have a different colour hover over the footer menu, from the footer widget sections, specifically where we have included our Terms and Conditions and Privacy?

You are most welcome here :slight_smile:

I’m not sure whether I need to open up a new thread or not but is there a way to have a different colour hover over the footer menu, from the footer widget sections, specifically where we have included our Terms and Conditions and Privacy?

Use the below CSS code to achieve this.

#page #footer-area .footer-nav a:hover {
    color: #bf6ef5 !important;
}

Perfect - thanks @Movin!

You are always welcome here :slight_smile: