guiderdoni.net

Bloc notes : spip, css, xhtml, web, standards, mac ...

Accueil du site > Spip > Menu statique hors boucle avec la class active ou expose

Articles de cette rubrique

Articles

publie le jeudi 11 septembre 2008 par Alexandra

Menu statique hors boucle avec la class active ou expose

Comment avoir un menu avec une classe active, dans un menu statique hors boucle, - ce qui rend impossible l’usage de la balise #EXPOSE, appelant tantôt des squelettes tels que contact, plan, sommaire ... , tantôt des articles, tantôt des rubriques ... Bref un menu complètement hétéroclite.

L’idée insufflée par b-b est la suivante :
Créer sa variable pour que dans l’inclure du squelette qui appelle le menu, on puisse dire d’où l’on vient : {nomdusquelette=oui}
Puis jouer ensuite avec les filtres de test

Menu statique hors boucle avec la class active ou expose Exemples dans les squelettes :

<INCLURE{fond=inc_navhaut}{sommaire=oui}>
<INCLURE{fond=inc_navhaut}{plan=oui}>
<INCLURE{fond=inc_navhaut}{inscription=oui}>
<INCLURE{fond=inc_navhaut}{loginpublic=oui}>
<INCLURE{fond=inc_navhaut}{contact=oui}>

- Si notre menu pointe sur des articles : <INCLURE{fond=inc_navhaut}{id_article}>

- Si notre menu pointe sur des rubriques <INCLURE{fond=inc_navhaut} {id_rubrique}>

Ce qui dans notre menu donnera quelque chose du genre :
- Pour l’appel à des squelettes spécifiques

<a href="./" title="Accueil " [(#ENV{sommaire}|=={oui}|?{' ',''}) class='current']>
<a href="#URL_PAGE{plan}" title="Plan" [(#ENV{plan}|=={oui}|?{' ',''}) class='current']>

- Pour l’appel à des articles à identifiant spécifique

<a href="#URL_ARTICLE{123}" title="Qui sommes nous ?" [(#ENV{id_article}|=={'123'}?{' ',''}) class='current']>
QUI SOMMES NOUS ?
</a>

- Pour l’appel à des rubriques à identifiant spécifique

<a href="#URL_RUBRIQUE{3}" title="mon titre" [(#ENV{id_rubrique}|=={'3'}?{' ',''}) class='current']>
Ma rubrique
</a>

Il faudra bien sur penser à définir sa class "current" dans sa css

#slatenav ul li a.current{
background:transparent url(backgroundOVER.gif) no-repeat top center;
}

Et le tour est joué

Voici le code complet du menu inc_nav.haut.html :

Celui de la css : On reprend le menu full css suivant http://www.13styles.com/css-menus/slate


Forum

Répondre à cet article

2005-2008 - Contenu en GPL http://www.guiderdoni.net - Site réalisé avec SPIP  1.9.2c
rechercher - plan du site - prive - webmaster@guiderdoni.net
CSS - XHTML - squelette - 33700