How to highlight current page?

  • Hi, anybody know how to make my current navigation page highlighted? Meaning that when I click on an nav item, it will change to different color.

    Here’s the link: Manger Production

    Thanks!
    Eric.

Viewing 1 replies (of 1 total)
  • Thread Starter JustBlog

    (@justblog)

    I just got that solved.

    In case anyone want to know how and also a note for myself:

    1. Go to every page that has the navigation bar and put give the page an id. For example the site I’m building, I have a page called “Latest News”, so i put <body id=”latest”> before the content of that page. This assigns an id “latest” to the page. You can put any id you want. Just to make sure you remember it.

    2. Depending on how you have your Navigation bar created. For my case, I’m using manual method of creating the Navigation Item in header.php . Example: <li class="li1"><a href="../latest-news/">Latest News</a></li>

    This assign the link to an id called “latest_link” which to be used in CSS.

    3. Finally go to style.css and put in the following code:

    body#latest a#latest_link{
color: #000000;
}

    You can put all the Nav items together to get the same current page highlight:

    body#latest a#latest_link,
body#contact a#contact_link
{
color: #000000;
}

    Just give a , to every id but the final id should have no , before { .

    Hope this helps.

    Eric. ??

Viewing 1 replies (of 1 total)
  • The topic ‘How to highlight current page?’ is closed to new replies.