I'm trying to figure out how to change my active nav item color on my WordPress theme, so that visitors will know what page they're on.
I did some searches and messed around with some code, but nothing seems to work.
My nav code is below if it helps:
#nav ul{
background-color:#669933;
width:780px;
display:block;
margin: 0px 0px 0px 0px;
height:auto;
padding:5px 0px 5px 0px;
text-align:center;
line-height: 1.4em;
font-size: 13px;
font-weight: bold;
}
#nav li{
display:inline;
border-right-width: 1px;
border-right-style: solid;
border-right-color: #E1E1E1;
}
#nav ul a{
text-decoration:none;
color:#FFFFFF;
margin: 0px 12px;
}
#nav ul a:hover{
text-decoration:none;
color:#F5E412;
}
#nav li.last{
border-right: none;
}
without more information, ideally a link to your site, there is not much to suggest.
what code is used to generate the nav?
the usual wordpress nav codes produce a current css class with the active cat/page/menu-item.
for instance:
http://codex.wordpress.org/Function_Reference/wp_list_pages#Markup_and_styling_of_page_items
http://codex.wordpress.org/Template_Tags/wp_list_categories#Markup_and_Styling_of_Category_Lists
you could have a look into the html code of the whatever active page, and see if there is one of these current classes on the nav item.
Thanks for the reply. The codex stuff really confuses me, I don't really get it yet.
Unfortunately I don't have the site live yet, I have a local install of WordPress.
Here is the code though:
<div id="nav">
<ul>
<li><a title="Go to the home page" href="****"><img src="http://localhost/xampp/wordpress/wp-content/uploads/2010/08/***" width="11" height="13"></a></li>
<?php wp_list_pages('title_li='); ?>
<li><a title="***" href="***">Testimonials</a></li>
<li><a title="***" href="***">Videos</a></li>
<li><a title="***" href="***">***</a></li>
<li class="last"><a title="Contact" href="http://localhost/xampp/wordpress/?page_id=118">Contact</a></li>
</ul>
</div>
If there's any more info you need from me that will help, please let me know.
The codex stuff really confuses me
get used to it - without it you will have to rely on outside help for the rest of your wordpress customisation days.
http://codex.wordpress.org/Function_Reference/wp_list_pages#Markup_and_styling_of_page_items
you could try to use:
`.current_page_item a { active nav item styles }
Foppa
