Community Forums › Forums › Archived Forums › Design Tips and Tricks › Agency Pro Navigation Hover Style
- This topic has 1 reply, 2 voices, and was last updated 9 years, 8 months ago by Tonya.
-
AuthorPosts
-
September 1, 2014 at 5:22 pm #122292DavidMember
Hi guys.
I am hoping someone can help me with this...I am trying to remove the hover style in Agency Pro. When you hover over the navigation bar you get a horizontal line, color change, and a background change. I would like to change all of these.
I am trying to make it appear seamless between 2 websites and this navigation hover change is too much to duplicate on the other site. For clarity's sake, click on If you click on "Gallery" in the navigation This is what I am dealing with. I would like to just have the text change color and that's it (no background color change or horizontal lines above. Does that make sense?
If this is too complicated or too much work, let me know and I will try a different theme, but I would like to try to make this one work if possible. It may be easier to pick a different theme and adjust fonts types, font sizes and link colors...what do you think?
Thank you.
David
David
visualvoodoo.comSeptember 1, 2014 at 7:26 pm #122303TonyaMemberHi David,
To make these changes, you need to open up the style.css file. You can do this via the Editor in WordPress admin (although be very careful as this is the live file) or by editing a copy of the file and then transferring it back onto your server. Either way, please follow along and we'll remove the stylings you do not want:
1. Go to line 1872 and comment out the border-color as such:
.agency-pro-red .genesis-nav-menu a:hover, .agency-pro-red .genesis-nav-menu .current-menu-item > a, .agency-pro-red .genesis-nav-menu .v .current-menu-item > a:hover { /* border-color: #de3233; */ }
2. Go to line 1023 and comment out both the background-color and border-color:
.genesis-nav-menu a:hover, .genesis-nav-menu .current-menu-item > a, .genesis-nav-menu .v .current-menu-item > a:hover { /* background-color: #282828; */ /* border-color: #d7c603; */ color: #d7c603; }
If you wish to also disable the background color change on hover in the submenu, go to line 1057 and comment out the background-color:
.genesis-nav-menu .sub-menu a:hover { /* background-color: #333; */ }
Make sure you save the file.
Now the next step is you need to change your child theme's version as then it will load a new version of this style.css file into the browser of your audience who have already visited your site. To do this, open up the functions.php file and find CHILD_THEME_VERSION. Change the value as such (increase the number):
define( 'CHILD_THEME_VERSION', '1.0.1' );
. Then save the file.I hope that helps.
Cheers,
Tonya
Software & Electrical Engineer and Programming Teacher ยท I’m on a mission to help developers be more awesome.
Find Me: KnowTheCode.io | @hellofromTonya | Profitable WordPress Developer Bootcamp -
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.