Le Menu haut et sous menu gauche 1 colonne

Avec le gestionnaire de menu vous pouvez facilement séparer la navigation en deux partie. Sur cette page le niveau supérieur (menu de niveau 1) de votre arborescence de page est affiché dans des onglets horizontaux. Et sur la partie gauche, les sous menus sont affichés verticalement..

La balise {menu}

La balise {menu} est donc inséréedeux fois dans le gabarit de cette page. Une première fois pour les menu de niveau 1, comme ceci : {menu template='simple navigation' number_of_levels='1'}.

La navigation à gauche devrait seulement contenir le deuxième niveau et les niveau inférieurs, selon ce qui est choisi au premier niveau. Et, les liens de troisième niveau devraient seulement être visible quand son parent au deuxième niveau est cliqué, autrement ils sont cachés.

La balise ressemble alors à ceci :{menu template='simple navigation' start_level='2' collapse='1'}

Feuille de style pour le menu

Puisque la navigation principale (haut) et la navigation secondaire (gauche) sont présentées différemment (une horizontale, l'autre verticale), deux feuille de style de navigation sont attachés au gabarits de cette page. Navigation: Simple - Horizontal pour le menu horizontal en haut. Navigation: Simple - Vertical pour les sous menus à gauche.

Tous les deux utilisent le même gabarit de menu

Cependant vous pouvez remarquer que les deux menus utilisent le même gabarit de menu, car le moteur de rendu est le même. La différence se fait grâce au CSS dans la feuille de style.

La barre latérale à droite

Vous pouvez facilement placer la barre latérale de navigation à droite. Regarder le Menu haut déroulant 2 colonnes la feuille de style contient la propriété float:left; dans l'élémént div#sidebar. Changé en float:right; et la barre latérale avec le menu changer de position, naturellement vous pouvez aussi ajuster les marges et le div#main.


Page précédente : Le Menu gauche 1 colonne
Page suivante : Le Menu haut déroulant 2 colonnes


Cette version de démonstration va se renouveler dans 11 minute(s)

[En savoir plus]

Bienvenue sur le site de démonstration de CmsMadeSimple.

Sur cette version de démonstration nous avons installé pour vous la version 1.11.11 de CmsMadeSimple avec aucune modification du code, de la configuration ou de module à l’exception de la langue Française dans le contenu des pages d'exemple.

Si vous souhaitez découvrir les autres versions proposées vous pouvez retourner sur la page d'accueil des démonstrations

Vous pouvez librement accéder au panneau d'administration, tester, casser et faire vos tests puisque cette démo se renouvelle toute les heures. Voici les identifiants pour accéder au panneau d'administration :

Nous vous souhaitons une excellente visite et surtout n'hésitez pas à venir nous passer le bonjour sur le forum ;)