Le menu est identifié par menuIcons.MIxx
- Barre horizontale
- Boîte latérale
Le style général de la barre horizontale du menu est dans ces lignes :
/********** block box Header Menu sections ******/
div.menuIcons { /* block menu */
padding: 8px 0;
}
div.menuIcons ul { /* block liste du menu */
margin: 0;
padding: 0;
list-style: none;
width: 100%;
}
div.menuIcons ul li { /* toutes les sections */
float: left;
margin-right: 8px;
text-align: center;
}
div.menuIcons ul li span { /* toutes les sections */
display: block;
white-space: nowrap;
}
div.menuIcons ul li.menu_flags { /* section drapeau */
float: left;
margin-right: 10px;
text-align: center;
}
div.menuIcons ul li.menu_flags img { /* séparation drapeau */
margin: 0;
}
div.menuIcons ul li.menu_admin { /* section admin */
float: right;
padding-right: 3px;
}
div.menuIcons ul li a span { /* lien */
color: #000000;
background-color: inherit;
text-decoration: none;
font: bold 11px Arial, Helvetica, sans-serif;
}
div.menuIcons ul li a span.current { /* lien actif */
color:#FF0000;
background-color: #000000;
text-decoration: underline;
}
div.menuIcons ul li a:hover span { /* lien survolé*/
color: #FF0000;
text-decoration: underline;
background-color: inherit;
position: relative; top: 1px; left: 1px;
}
/*****************************************************************************/
Pour personnaliser le menu, par exemple si vous le mettez en haut et en bas du site et qu'il doit avoir un style différent.
Pour la position dans le bas de page (#BottomBoxes), ajouter ces lignes :
/********* MENU en bas *************/
div.menuIcons.MIB0 ul li a span { /* lien */
color: #1e8fff;
background-color: inherit;
text-decoration: none;
font: bold 11px Arial, Helvetica, sans-serif;
}
div.menuIcons.MIB0 ul li a span.current { /* lien actif */
color:#000;
background-color: #fff;
text-decoration: underline;
}
div.menuIcons.MIB0 ul li a:hover span { /* lien survolé*/
color: #FFcc00;
text-decoration: underline;
background-color: inherit;
position: relative; top: 1px; left: 1px;
}
/************************************/
B pour #BottomBoxes
0 pour la configuration principale
Pour cacher le lien ADMIN, ajouter ces lignes :
div.menuIcons ul li.admin a span { /* lien */
color: transparent;
}
Pour placer le lien ADMIN ailleurs que dans la barre de menu, modifier les lignes suivantes :
div.menuIcons ul li.menu_admin { /* section admin */
position: absolute; top: 5px; right: 3px; /*position absolue : en haut à 5 px et à droite à 3 px*/
}
On peut faire cette modification pour tous les items du menu, y compris les icônes qui sont créées :
div.menuIcons ul li.menu_home |
Accueil |
div.menuIcons ul li.menu_forum |
Forum |
div.menuIcons ul li.menu_blog |
Blog |
div.menuIcons ul li.menu_faq |
Faq |
div.menuIcons ul li.menu_links |
Liens |
div.menuIcons ul li.menu_guestbook |
Livre d'or |
div.menuIcons ul li.menu_news |
Nouvelles |
div.menuIcons ul li.menu_photos |
Photos |
div.menuIcons ul li.menu_download |
Téléchargement |
div.menuIcons ul li.menu_monicone |
Nom de l'icône créée |
|
Le style général du menu dans une boîte latérale est dans ces lignes :
/************ block box lateral Menu Sections ************/
ul.boxmenu { /* block liste */
margin: 0;
padding: 5px 0;
list-style: none;
}
ul.boxmenu li { /* items de la liste */
margin-bottom: 10px;
}
ul.boxmenu li .curr_item { /* item actif de la liste */
margin-bottom: 10px;
}
ul.boxmenu li img { /* icones */
vertical-align: middle;
margin-right: 10px;
}
/***********************************************************/
Si aucune autre indication n'est spécifiée, les items auront les mêmes attributs que les items des articles.
Pour personnaliser le menu dans une boîte latérale, ajouter ces lignes :
ul.boxmenu li a { /*lien des items du menu*/
color: #c00000;
}
ul.boxmenu .curr_item { /*item actif*/
background: #1e8fff;
}
ul.boxmenu li.curr_item a span { /*couleur du lien de l'item actif*/
color: #fff;
}
|