How to change the Menu bar font exclusively.

• 

  jbavuso · Member · Aug 14, 2014 at 5:32 pm

  • Copy link
  • Add topic to favorites

  How to change the menu heading fonts to a larger different color font and even a different font without using the standard fonts.

  The blog I need help with is bcnupdate.com.

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

• 

  thesacredpath · Member · Aug 14, 2014 at 9:29 pm

  • Copy link

  I see you have a font size declared in your custom CSS for them menu in .wf-active .nav-menu li a.

  To change the color of the current page menu item, add the following CSS. It is currently set as an RGB color with an alpha transparency (the 0.7 at the end). You can change it to a hex color if you wish, or even use a named color, such as darkgreen or lightblue

  .main-navigation li.current_page_item a, .main-navigation li.current-menu-item a {
      color: rgba(228, 127, 83, 0.7);
  }

  The non-current menu items have two colors. The non-hovered color and the hover color. Here is the CSS for those.

  .main-navigation a {
      color: #4a7735;
  }
  .main-navigation a:hover {
      color: rgba(228, 127, 83, 0.7);
  }