Title font size and menu color

• 

  kayleneheck · Member · Sep 1, 2015 at 8:36 pm

  • Copy link
  • Add topic to favorites

  Two questions today …

  First, it possible to increase the size of our Title font size. I’m referring to the title as found at https://newopsf7101.wordpress.com/wp-admin/customize.php?return=%2Fwp-admin%2Fpost.php%3Fpost%3D439%26action%3Dedit%26message%3D1 and is “Omaha Presbyterian Seminary Foundation.” As we’re not going to use a header (The images will be enough) it would be nice if we could increase the font size of the title.

  Secondly, is there a way to change the color of the top menu? We haven’t decided on a palette yet so we don’t really know what menu color we’d eventually like/need but would like to find out how to change the menu coloration, assuming it’s possible.

  Thank you.

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

• 

  thesacredpath · Member · Sep 1, 2015 at 10:05 pm

  • Copy link

  Hi there, for the site title, add the following to your custom CSS and then adjust the font size as you desire.

  .wf-active .site-title span {
      font-size: 20.8px;
  }

  On the top section with the nav, are you wanting to change it all, including behind the site title? If so, you can use this. I’ve used two different blue-ish colors for demonstration purposes which you can edit.

  .site-header {
      background-color: #00cccc;
  }
  .main-navigation, .main-navigation ul, .main-navigation ul ul {
      background-color: #0066cc;
  }

• 

  kayleneheck · Member · Sep 1, 2015 at 10:27 pm

  • Copy link

  Thank you … both worked well although the second item … changing the background color behind the menu wasn’t what I was looking for but will likely use … a bonus.

  I was wondering if there is a way to change the color of the menu text? I see I didn ‘t actually use the word “text” in my question … my error.

• 

  thesacredpath · Member · Sep 2, 2015 at 12:18 am

  • Copy link

  Yes, you can add the following which will allow you to change the non-hovered and hovered text colors. I’ve also included a rule to change the “current page item color in the event you want to do that.

  .main-navigation a {
      color: #cc0000 !important;
  }
  .main-navigation a:hover {
      color: #66cc00 !important;
  }
  .main-navigation li.current_page_item > a, .main-navigation li.current-menu-item > a, .main-navigation li.current_page_ancestor > a, .main-navigation li.current-menu-ancestor > a {
      color: #00cccc !important;
  }

• 

  kayleneheck · Member · Sep 2, 2015 at 10:02 pm

  • Copy link

  Thank you for all of that … I used it all!

• 

  thesacredpath · Member · Sep 2, 2015 at 10:54 pm

  • Copy link

  You are welcome.