ThemeShaper Forums » Thematic

[closed]

Adding Active Highlight to Pages on Menu

(6 posts)
  • Started 4 years ago by mlou
  • Latest reply from yahyaayob
  • This topic is resolved
  1. mlou
    Member

    On my horizontal menu bar, I would like to add an active state where the page name is highlighted in the menu based on whatever page the user is currently on.

    For example, if the user was on the ABOUT US page, then ABOUT US would be highlighted a different color. How do I do that?

    Posted 4 years ago #
  2. in your child theme's style.css add the line:

    .current_page_item { background: red }

    Posted 4 years ago #
  3. mlou
    Member

    Thanks, I got it to work by using:

    .sf-menu .current_page_item a {background: red}

    Posted 4 years ago #
  4. hlynnt
    Member

    This isn't working for me :(

    I want to change the color of the text of the current page in the navigation. How should I do this?

    http://horizonurns.com

    Posted 4 years ago #
  5. hlynnt- Specificity gets really confusing sometimes. It's strange with your css the .sf-menu .current_page_item a is color: white in Safari but for some reason Firefox is seeing the pseudo element .sf-menu a:visited as being more specific than .sf-menu .current_page_item a

    ...well anyway try adding .sf-menu .current_page_item a:visited like so:

    .sf-menu .current_page_item a, .sf-menu .current_page_item a:visited, .sf-menu .current_page_ancestor a, .sf-menu .current_page_parent a {
    color:#FFFFFF;
    }
    Posted 4 years ago #
  6. yahyaayob
    Member

    Thanks bro! Learning from your concept, I manage to get the page_item font color to all universal white.

    But I am still figuring out how to rid of the gray borders? I need help.

    http://www.watchwerkz.com.sg/wp

    Posted 4 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.