Community Forums › Forums › Archived Forums › Design Tips and Tricks › Change Nav Menu – News Pro
Tagged: primary menu
- This topic has 9 replies, 3 voices, and was last updated 8 years, 1 month ago by craigtech.
-
AuthorPosts
-
January 31, 2016 at 5:37 pm #177996rogerpParticipant
I want to change the Nav Menu on my news pro theme.
I want to make all the menu items have the same highlight colour of 273541
Then make he highlight colour 3CA6FE
Much the same as the studiopress site - and I also like the menu on http://www.gizmodo.co.uk/
Any tips / tutorials appreciated as I can't find the CSS to change it
Thanks
Roger
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FutureJanuary 31, 2016 at 5:46 pm #177998Brad DaltonParticipantFebruary 1, 2016 at 5:02 am #178026rogerpParticipantThanks for the tutorial - I have made these changes
/* Primary Navigation
--------------------------------------------- */.nav-primary {
border-bottom: 1px solid #000;
border-top: 1px solid #e3e3e3;
background-colour: #273541;
}
.nav-primary a {
color: #3CA6FE;But nothing changed?
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FutureFebruary 1, 2016 at 6:09 am #178030rogerpParticipantI am making progress but cannot find the setting to make the default background for all menu items not be white
Thanks
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FutureFebruary 1, 2016 at 6:22 am #178032rogerpParticipantOk found the problem - US / UK spelling!
background-colour: #273541;
Should be
background-color: #273541;
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FutureFebruary 1, 2016 at 6:22 am #178033rogerpParticipantNow I would like to make the menu Bar half its height?
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FutureFebruary 1, 2016 at 7:37 am #178046rogerpParticipantI have got there!
Here are all the changes I had to make
#273541 - Dark background
#3CA6FE - Light Blue highlight colourChanges to make News Pro Header Menu Colours different
** Make Header Bar Dark Blue **
Site Header
---------------------------------------------------------------------------------------------------- */
/* RP - Change header colour to dark blue */
.site-header {
background-color: #273541;** Make all Menu Items background default dark blue **
/* Primary Navigation
--------------------------------------------- */.nav-primary {
border-bottom: 1px solid #000;
border-top: 1px solid #e3e3e3;
background-color: #273541; <<<<<<<<<<<<<<<<<<<<<<<<
}
.nav-primary a {
color: #fff;
}/* Secondary Navigation
--------------------------------------------- */.nav-secondary {
border-bottom: 1px solid #e3e3e3;
background-color: #273541; <<<<<<<<<<<<<<<<<<<<<<<<<<
}** Current Menu Item **
.genesis-nav-menu a:hover,
.genesis-nav-menu .current-menu-item > a {
background-color: #3CA6FE;
color: #fff;
}** Make Menu Half Height and text White **
Site Navigation
---------------------------------------------------------------------------------------------------- */.genesis-nav-menu {
clear: both;
color: #fff;
font-size: 14px;
font-size: 1.4rem;
font-weight: 700;
line-height: 0;
width: 100%;You can see the new menu now at http://www.rogerperkin.co.uk
Roger
https://www.rogerperkin.co.uk/
Check out my Network Automation Training – Training the Network Engineers of the FutureFebruary 25, 2016 at 10:21 am #179896craigtechMemberI am using the same Child Theme as RogerP, "News Pro", and have the same issues. I have been able to change certain colors in the navigation menu, while others are elusive. My specific problem is changing the primary text on the navigation menu from the default "BLACK" to "WHITE". My background color is a very dark blue. I have changed the "current page" navigation item to have a lighter blue color with white text
You can find my site here for a better explanation: Salem Public Library
I have combed through the forums, and watched several YouTube tutorials and cannot achieve the results that others have. At this point I'm beginning to think there is a bug somewhere. Here is what I've done so far:
- edited the styles in the editor to add color:#ffffff;
- Tried Genesis Extender (which helped with some of the color like a:visited
- Read through the documentation on Genesis and News Pro child theme
Any help would be appreciated. Thanks in advance.
February 25, 2016 at 10:29 am #179897Brad DaltonParticipantFebruary 26, 2016 at 8:39 am #179974craigtechMemberThat's it, braddalton. Perfect. Thanks a million.
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.