[SOLVED] How to include a css menu with links to specific classes?

[didou038]

Hi all !

i want to integrate in my template this css menu (http://demo.tutorialzine.com/2010/06/css...demo.html#).
It uses some specific class in CSS for each link.

I don't how to integrate it in my template.
I think i must create 5 pages, index (and replace home by index in the css class) and the 4 others (portfolio, contact, services, about).

But this doesn't work (in local).

Have you an idea please ?

Best Regards from France

[yojoe]

Are you familiar with template creation, especially when it goes to invoking builtin GS navigation menu, or Mvlcek's advanced menu plugin ?

Just add in your template

Code:

<div>
<ul id="navigationMenu">
[call_menu_function]
</ul>
</div>

where: [call_menu_function] is the place, where you call menu function.
Read about template functions in wiki, or about Mvlcek's plugins.

Of course you have to add to template's css file all styles of the menu you have shown, along with images in right place, and javascript files to have fancy menu item roll effect.
But everything is described in menu creation tutorial.

[didou038]

Are you familiar with template creation, especially when it goes to invoking builtin GS navigation menu, or Mvlcek's advanced menu plugin ?

I begin in template creation, so I don't look GS navigation menu or Mvlcek's advanced menu plugin.

thank you for the answer, I'll look in the wiki and look for Gs Navigation menu or Mvlcek's adv menu plugin.

[mikeh]

Are you familiar with template creation, especially when it goes to invoking builtin GS navigation menu, or Mvlcek's advanced menu plugin ?

Just add in your template

Code:

<div>
<ul id="navigationMenu">
[call_menu_function]
</ul>
</div>

where: [call_menu_function] is the place, where you call menu function.
Read about template functions in wiki, or about Mvlcek's plugins.

Of course you have to add to template's css file all styles of the menu you have shown, along with images in right place, and javascript files to have fancy menu item roll effect.
But everything is described in menu creation tutorial.

It looks like he wants class="link-page-slug" on each anchor tag.
I don't think Mvlckes plugins do this without modification.

[Cary]

It looks like he wants class="link-page-slug" on each anchor tag.
I don't think Mvlckes plugins do this without modification.

Hmmm... Looks like something that could be accomplished with a bit of jQuery.

As long as one keeps the menu-text name simple and the classes identical to those names, something like:

$("#menu a").attr('class', function() {
return this.text; });

would work.

http://jsfiddle.net/SZXfF/3/

There's undoubtedly a way to set the class attribute based on the parent <li> class (which Mvlcke's plugin automatically generates based on the page slug) but that would require someone who actually knows jQuery.

[didou038]

ok, thanks for all !

I've no knows about jQuery ...

I think I found an obscure solution. Use style.php instead of style.css and recover the "slug" in php to name the class "li". Not probably the best ...

edit : I found where my problem!
the links in the menu have no class assigned. It is necessary that I can find or implement the addition of a class in the links menu. the class should be the name of the page and the link text must also be regulated by <span> tag for the effect of slide work (I know not so clear because of my bad English)

[didou038]

SOLVED !

I found the solution to add "span and class" to my menu in this topic : http://get-simple.info/forum/topic/2016/...menu-code/

ALL works very well !!! Thanks all for your help and your time !

I need to improve my knowledge on this CMS because it's so ... WONDERFULL !!!