Forums

Header Nav li class

Permalink
Can i apply an individual class to each menu item on the Header Nav.

Like:

<li class="home">Home</li>
<li class="services">services</li>

Thanks
fjhadd
 
LucasAnderson replied on at Permalink Reply
LucasAnderson
Yes. You would need to add a custom attribute such as "Menu Class" and then set it for each of your pages.

You will also need to create a custom template for your auto-nav.

Custom Attributes:
http://www.concrete5.org/documentation/general-topics/attributes/...

Custom Templates:
http://www.concrete5.org/documentation/general-topics/custom-templa...
http://www.concrete5.org/documentation/how-tos/customize-a-block-s-...

Auto Nav How-To:
http://www.concrete5.org/documentation/how-tos/primer-auto-nav-bloc...
tallacman replied on at Permalink Reply
tallacman
You could also use nth child selectorshttp://css-tricks.com/how-nth-child-works/...

But of course, IE…

Steve
fjhadd replied on at Permalink Reply
fjhadd
That is a great idea. But my problem is that the menu is not working properly in IE. Bad for me i just hate IE.
ScottC replied on at Permalink Best Answer Reply
ScottC
i may be overthinking this but what about simply:
around line 66 or so under autonav/view.php

echo('<li><a href="' . $pageLink . '">' . $ni->getName() . '</a>');
//change to 
echo('<li class="'.strtolower($ni->getName()).'"><a href="' . $pageLink . '">' . $ni->getName() . '</a>');


not ideal, but at least it gives you a class for each nav element, repeat for the other 2 cases above(in the code in concrete5) where nav selected etc are available.
fjhadd replied on at Permalink Reply
fjhadd
It works. But i make a new page attribute (menu_class) The web site is in spanish and it have special characters that i cant put in the css. Creating the new attribute allow me to eliminate the special characters from the words.

My other problem is that i am using the superfish block. I cant get it to work with the superfish.
uswebdesigner replied on at Permalink Reply
uswebdesigner
What you shared was super helpful. I even combined it with instructions on this page:

http://www.concrete5.org/marketplace/addons/superfish/questions-and...

to modify the superfish add-on (see below).

My question - the resulting class names for multi-word page names ends up like this, for example "facilities & services" rather than using a slug like this "facilities_services" or something like that. Do you or anyone know how to do that?

FYI -
To change Superfish add-on, follow link above for instructions on what to move where, and then changed around line 126 of view.php that was this:

echo('<li><a href="' . $pageLink . '" '.($newWindow?'target="_blank"':'').'>' . $name . '</a>');


to this:

echo('<li class="'.strtolower($ni->getName()).'"><a href="' . $pageLink . '" '.($newWindow?'target="_blank"':'').'>' . $name . '</a>');