zBench and menu navigation

  • Author
    Posts
  • #1545178

    feelingblind
    Member

    I want to customize the colors of the top menu and search bar with CSS, but no matter what changes I make the default colors stick. The only way I can change the colors is with the limited “change colors” option, which doesn’t give me the full flexibility that editing the CSS would.

    The blog I need help with is tstogame.com.

    #1545338

    justpi
    Member

    Waht exactly do you want to change, the text or the background?

    #1545341

    feelingblind
    Member

    The colors of the menu, the drop-down menu, and the color when you hover over a selection in the drop-down menu. I know how to do this in CSS, but for some reason this theme won’t let those changes stick. Instead the five-color option through the WordPress custom design package overpowers anything I place into the custom CSS.

    #1545348

    justpi
    Member

    Well, you didn’t answer my question: text colors or background colors?
    Assuming you’re talking about the text only, and assuming you want the same colors for top level items and sub items, add these and change the hex numbers:

    .nav li a, .nav li:hover li a, .nav li.sfhover li a {
    color: #123456;
    }
    .nav li:hover a, .nav li:hover li:hover a, .nav li.sfhover li.sfhover a {
    color: #abcdef;
    }

    #1545349

    feelingblind
    Member

    Now I see where our signals are getting crossed. Your code worked in changing the text colors. I guess now I want to know how to change the background color of the menu, and the drop-down menu background color, and the background color when you hover over a selection in that drop-down menu.

    Also, how to change the color of the text in the search bar.

    I appreciate the help. My head has just been spinning from trying to get things customized.

    #1545351

    justpi
    Member

    You’re welcome.

    To change the text color of the searchbox, add this and change the hex number:

    #search-form #s {
    color: #123456;
    }

    Your bg question is again imprecise. If you mean you want the same bg color for top level items and dropdown items, and if you mean you want it to change when you hover over a dropdown item but not when you hover over a top level item, add these and change the hex numbers:

    .nav li, .nav li:hover {
    background-color: #456789;
    }
    .nav li:hover li:hover {
    background-color: #987654;
    }

    #1545352

    feelingblind
    Member

    Thanks very much, your solution worked perfectly.

    I think I may have realized my error too. I was trying to substitute colors in the CSS using rgb (255, 255, 255) instead of #FFFFFF which is used in the original theme. My guess is the difference in coding was the reason the CSS wouldn’t work for me.

    #1545353

    justpi
    Member

    You’re welcome, but I’m not seeing any changes on http://tstogame.com/. Which blog are you working on please?

    (And no, RGB instead of HEX would have worked: your mistake is there must be no space after “rgb”.)

    #1545355

    feelingblind
    Member

    Yes, this is the site I’m working on. I haven’t applied any permanent changes yet just enough to test the code.

    I believe I was correct when testing, but just made the spacing mistake in this post. Oh well, still it’s nice to know I can use the code you provided to get the customization I want once I figure out the best color combinations to make everything really pop.

The topic ‘zBench and menu navigation’ is closed to new replies.