CSS Navigation help needed.
Permalink
First post :) Loving concrete5 so far. Its been very easy to pick up so far but I'm a little stuck with creating a navigation.
The nav I'm building has 4 links using css background images (I don't need them editable) with 3 states: Normal, hover and active.
How do I add the css class 'active' to the active link? For example when on the Company page I want the active class on 'company'...
<ul id="nav">
<li id="nav-company" class="active">
<a href="#">Company</a>
</li>
<li id="nav-charity">
<a href="#">Company</a>
</li>
<li id="nav-hall">
<a href="#">Hall</a>
</li>
...
</ul>
Thanks.
The nav I'm building has 4 links using css background images (I don't need them editable) with 3 states: Normal, hover and active.
How do I add the css class 'active' to the active link? For example when on the Company page I want the active class on 'company'...
<ul id="nav">
<li id="nav-company" class="active">
<a href="#">Company</a>
</li>
<li id="nav-charity">
<a href="#">Company</a>
</li>
<li id="nav-hall">
<a href="#">Hall</a>
</li>
...
</ul>
Thanks.
Thanks for the quick reply okhayat.
Not sure the autonav gives me css class control on individual <li> items. I need this as each link has its on css width and background.
Not sure the autonav gives me css class control on individual <li> items. I need this as each link has its on css width and background.
If the menu is really static, and not gonna change, then simply include it in your template as needed.
Otherwise, you'd be able to add an attribute, e.g. CSS CLASS, and assign the class of each page you need to be used in the menu, then add this CSS CLASS to the LI item.
Otherwise, you'd be able to add an attribute, e.g. CSS CLASS, and assign the class of each page you need to be used in the menu, then add this CSS CLASS to the LI item.
OK I think I understand... :)
So I can add a CSS CLASS to each page using attributes, then apply that CSS CLASS to the LI.
How do I add an attribute CSS CLASS to each page?
So I can add a CSS CLASS to each page using attributes, then apply that CSS CLASS to the LI.
How do I add an attribute CSS CLASS to each page?
1. Dashboard -> Pages and Themes -> Page Types -> Add Page Attribute.
2. Select Text -> Go
3. Handle: css_class, Name: CSS Class -> Add Attribute
4. Goto each page you need to assign a class to and add it in the Properties -> Custom Fields
2. Select Text -> Go
3. Handle: css_class, Name: CSS Class -> Add Attribute
4. Goto each page you need to assign a class to and add it in the Properties -> Custom Fields
Brilliant, working perfectly. Thanks.
Hello:
I need to add this a:active or a:current funcionality to the site:http://www.virtualintegral.co.cc/semaica... in order to make current link change color and background.
Already created the attribute, but then I got stuck.
Please can you further explain solution? Thanks.
I need to add this a:active or a:current funcionality to the site:http://www.virtualintegral.co.cc/semaica... in order to make current link change color and background.
Already created the attribute, but then I got stuck.
Please can you further explain solution? Thanks.
If yes, then you need to customize the Header Menu template. It's a file under /concrete/blocks/autonav/templates/header_menu.php
Then change your CSS to fix the generated code if needed.