• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

Lifestyle Pro – How to Change Background of Navigation Bar and Font Color

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Log In
Register Lost Password

Community Forums › Forums › Archived Forums › Design Tips and Tricks › Lifestyle Pro – How to Change Background of Navigation Bar and Font Color

This topic is: not resolved

Tagged: customize, menu, Navigation Bar

  • This topic has 2 replies, 3 voices, and was last updated 12 years, 4 months ago by burnook.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • November 11, 2013 at 11:25 am #72324
    sharonmc
    Member

    Hi I want to change the background color of the Primary navigation menu to navy blue and the font color to white so it stands out. Right now people find it hard to see that navigation/menu (the with Home, About Us...).

    Can someone tell me what has to be changed?

    Here's the website: http://www.cnuontario.org

    Thanks,

    Sharon

    http://www.cnuontario.org
    November 11, 2013 at 4:08 pm #72367
    RobG
    Member

    Hello Sharon, In your style.css file look for the folowing css codes below, CCP the css code I have provided and replace your code with this one. All I did was add the background-color: #000066; to the hover effect and added the blue background and white text as you requested.

    I hope this is was you are looking for.

    /* Primary Navigation
    ------------------------------------------------------------ */

    
    #nav li a:hover,
    #nav li a:active,
    #nav .current_page_item a,
    #nav .current-cat a,
    #nav .current-menu-item a {
       background-color: #000066;
    	color: #fff;
    }
    
    

    To speed up the process please post the link to the website in question.

    We recommend using Firebug to view source codes http://getfirebug.com/

    RobGoss WordPress Developer
    We build WordPress websites for your business or personal goals
    http://www.robgoss.com / Follow me Twitter / https://twitter.com/robgoss

    January 29, 2014 at 4:54 am #87638
    burnook
    Member

    this is what im looking for but in my case i am using metro theme. I can't seem to find any solution for this i can't still change my font color for my navigation menu.

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘Design Tips and Tricks’ is closed to new topics and replies.

CTA

Ready to get started? Create a site or shop for themes.

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2026 WPEngine, Inc.

Products
  • Create a Site with WP Engine
  • Shop for Themes
  • Theme Features
  • Get Started
  • Showcase
Company
  • Brand Assets
  • Terms of Service
  • Accptable Usse Policy
  • Privacy Policy
  • Refund Policy
  • Contact Us
Community
  • Find Developers
  • Forums
  • Facebook Group
  • #GenesisWP
  • Showcase
Resources
  • StudioPress Blog
  • Help & Documentation
  • FAQs
  • Code Snippets
  • Affiliates
Connect
  • StudioPress Live
  • StudioPress FM
  • Facebook
  • Twitter
  • Dribbble