[resolved] Highlight the current page in menu (7 posts)

  1. Akasashasha
    Posted 2 years ago #


    how to highlight the current page in the menu (I'd like to change the background color of the current menu) ?

    thank you

  2. WPyogi
    Forum Moderator
    Posted 2 years ago #

    Depending on your theme, generally, each page has a unique class or id assigned to it (look at the code using Firebug) -- so you can use that as part of a CSS selector to target the menu when on that page. Without seeing your site no way to be more specific.

  3. Akasashasha
    Posted 2 years ago #

    thanks, I found the solution ... sorry I forgot to say I'm using Esplanade theme by onedesigns.com ...

    sooo in case someone needs it, it is very simple :
    if using this template, edit the file wordpress/wp-includes/css/admin-bar.css and add this line :

    #access li.current-menu-item a { background-color:#code_of_the_color_you_want_as_background; }

    thats it !

    see you guys

    PS : I think it is the same process for theme twenty eleven

  4. WPyogi
    Forum Moderator
    Posted 2 years ago #

    Are you trying to change the menu on your actual site? If so, that file is not the correct place to make CSS changes...

  5. Akasashasha
    Posted 2 years ago #

    I'm working locally at the moment ... why isn't it the right place ? if that is a question of child theme, I made a complete copy of the theme and renamed it so no problem if an update comes ... anyway, I always update my website with winmerge or the likes ... more work, but much safer, and this enable me to learn about any new features.

  6. WPyogi
    Forum Moderator
    Posted 2 years ago #

    admin-bar.css styles the admin bar, not the theme. You should be putting any CSS changes in a style.css file (unless you theme is very atypical and has some other set up).

  7. Akasashasha
    Posted 2 years ago #

    so ... that means I should make the changes in my style.css and enter a lign of code for each of my menu item ?
    is that right ?

    edit : ok, I added this line in my style.css

    #access li.current-menu-item a {

    ... funny that firbugg was pointing to the admin-bar.css ...

    thank you for your help

Topic Closed

This topic has been closed to new replies.

About this Topic