"Le Guide Web partage mon parcours pour créer un business rentable en ligne."

dimanche 16 juin 2013

Ajouter un menu dans Blogger

Dans le HTML, il n'est pas encore une balise pour un menu de navigation, en théorie le menu de navigation est un ensemble des liens.
La grande majorité les menus sont fait avec les listes non ordonnées, pour savoir plus l'élément liste et ses composant consultez l'article Donnez du style à vos listes d'éléments qui est très bien rédigé et compréhensif.

Principe de base 

Le principe de base d'un menu déroulant est le suivant:
Les éléments d'un niveau n'apparaissent que lorsque  l'utilisateur survole un élément de niveau supérieur.
Par exemple, on prend le menu suivant






Le deuxième niveau contenant 'photos' et 'vidéos' n'apparaît que lorsque l'utilisateur survole l’élément 'images' de premier niveau.



Le troisième niveau contenant 'catégorie 1' et 'catégorie 2' n'apparaît que lorsque l'utilisateur survole l’élément 'photos' de deuxième niveau.

Pour ajouter un menu dans Blogger, on passe par trois étapes principales.

Première Etape

Dans la première étape on va utiliser les balises des listes de HTML comme suit :

<ul id="Liste Principale">
     <li>Element Principal 1 </li>
     <li>Element Principal 2 </li>
    <li>Element Principal 2 </li>
</ul>

<ul> pour définir la liste principale composée des éléments principales
<li> pour définir les éléments  principales.


Pour ajouter des sous menus dans les éléments principales on ajoute une liste secondaire dans les éléments principales comme suit:

<ul id='Liste Principale'>
  <li>Element Principal 1 </li>
  <li>Element Principal 2 </li>
       <ul id='Liste Secondaire2-1>
             <li>Element Secondaire2-1-1</li>
            <li>Element Secondaire2-1-1</li>
       </ul>
  <li>Element Principal 2 </li>
</ul>

Deuxième Etape

On ajoute du code CSS pour donner le style finale qu'on veut.

Aucun commentaire:

Enregistrer un commentaire