How to change toe color of the menue bar?

• 

  heilendewege · Member · Dec 20, 2013 at 5:54 pm

  • Copy link
  • Add topic to favorites

  Hi there
  How can I change the color of my menue bar (it’s now black) and there is no change-button in the costum design color change section of the theme. It seems fix and not changeable for me. So how do I change? I can change the color when somebody clicks on the menue but not the menue color itself.
  Thanky a lot
  Katharina

  The blog I need help with is: (visible only to logged in users)

• 

  kraftbj · Staff · Dec 20, 2013 at 8:27 pm

  • Copy link

  Howdy,

  You can change those with a little bit of CSS code since you have WordPress.com Premium. You can edit your CSS by visiting Appearance->Customize->CSS and add something like this in the box that appears:

  nav, div.menu {	
  	background: #ccff00; // background of the parts of the menu without a link
  }
  
  nav a, div.menu a {
  	background: #ccff00;
  	border-bottom: 1px solid #ccff00; // background of the links, should be the same as above
  }
  
  nav a:before, div.menu a:before {
  	background: #000000; // the border between the links
  }
  
  nav a:after, div.menu a:after {
  	background: #000000; // the border between the links, should be the same as the one before it
  }

  You can choose the color you’d like from a site like http://www.colorpicker.com/ . The six-character code at the top is what you’ll put in place of cc5500 and 000000 in the examples above.

  With WordPress.com Premium, even if the options are built-in, you can still change a whole heck of a lot via CSS. If you ever need help with what code to put where, we have a dedicated forum with volunteers and staff that only work on CSS. That can be reached at https://en.forums.wordpress.com/forum/css-customization

  Cheers!

• 

  heilendewege · Member · Dec 20, 2013 at 8:44 pm

  • Copy link

  cooool, thanks!! One more thing, When the menue gets so long that it will go over two rows – how to change the line color between the two menue lines?

• 

  kraftbj · Staff · Dec 20, 2013 at 9:16 pm

  • Copy link

  I’m almost positive that the border-bottom rule in the sample set defines that. That slipped by me when I was notating it.

  To repeat what’s below, with correct notation:

  nav a, div.menu a {
  	background: #ccff00; // background of the links
  	border-bottom: 1px solid #ccff00; //the line under each row of links
  }

  Cheers!

• 

  heilendewege · Member · Dec 20, 2013 at 9:28 pm

  • Copy link

  Yes you are right! Thanks for the very helpful and quick help!
  Cheers

• 

  kraftbj · Staff · Dec 20, 2013 at 9:42 pm

  • Copy link

  Anytime. Have a great weekend and holiday!