Change hover in navigation bar and rename home page

  • nop

    #2639

    Hello,

    I would like to change hover in navigation bar to have the same behavior than the one we have with twenty ten theme :

    – when moving the mouse on another page of the navigation bar, the current page should’t remain selected with grey color, it should move with the mouse

    – I would like to change the color of the hover (have a dark grey instead of light grey)

    Also is it possible to rename the “home” page? I made it on twenty ten theme by changing the mo file but wasn’t able to do the same for the mo file of graphene.

    Thank you very much for your help.

    Arnaud

    Mod

    Kenneth John Odle

    #21030

    You’ll have to do a bit of digging. Look through the navigation portion of the theme’s style sheet for anything labeled “current-menu”. (You’ll probably want “current-menu-ancestor”, but I may be mistaken here–it’s been a while.)

    Add that to custom CSS or your child theme’s style sheet and style it like other menu items. Ditto “hover” items.

    Rename the home page? Do you mean on the menu? You can use a custom menu for that. If you mean somewhere else, let me know.

    Include a link if you need further help; it’s easier to offer specific advice.

    nop

    #21031

    thank you !

    Thanks to you I alsmot managed to do what I wanted.

    here is it, if it can help others :

    /* Top level header menu, default state */

    #header-menu > li {
    font: normal 12px helvetica;
    color: #aaa;
    margin: 0 2px;
    }

    #header-menu > li > a {
    background : #000;
    color: #aaa;
    line-height: 16px;
    padding: 9px 10px 10px;
    }

    /* Top level header menu, hover and current state */

    #header-menu > li:hover > a,
    #header-menu > li.current-menu-item,
    #header-menu > li.current-menu-ancestor {
    color: #fff;
    background: #333;
    line-height: 12px;
    }
    #header-menu > li.current-menu-item > a,
    #header-menu > li.current-menu-ancestor > a {
    color: #fff;
    background: #333;
    }

    Now I just need to figure out how to change the style of the current menu item when I put the mouse on another menu item (hover) : then in that case the current menu item style should be the defaut style. Do you know how I should adapt the code to get this behavior?

    thank you !

Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.
Do NOT follow this link or you will be banned from the site!