Blog d'aide de Blog4ever

Blog d'aide de Blog4ever

Sous-menu dans la barre de navigation

297 appréciations
Hors-ligne
Bonjour,

Il est désormais possible d'ajouter un niveau de sous-menus à votre barre de navigation. La présentation de l'outil de personnalisation de la barre de navigation a été modifiée en conséquence pour accueillir cette fonctionnalité.







Pour les blogs utilisant le MasterDesign ou un RapidDesign hautement personnalisé, il faudrait très certainement faire quelques ajustements dans votre CSS.

Si vous êtes en MasterDesign et que les sous-menus n'apparaissent pas correctement, ajoutez le code CSS suivant à votre CSS : 

nav ul ul {
    float: none;
    position: absolute;
    display: none;
    background-color: inherit;
    margin: 0;
    padding: 0 20px;
    margin-left: -20px;
    padding-bottom: 10px;
}
nav li:hover ul {
    display: block !important;
}
nav ul ul li {
    display: block;
    white-space: nowrap;
}
nav ul .caret {
    margin: 18px 0 0 10px;
    border-width: 6px;
}


Voici les classes CSS à disposition pour le personnaliser :

La flèche indiquant qu'il s'agit d'un menu avec sous-menus :
nav .caret {
    /* Votre code CSS */
}


Le sous-menu en lui-même :
nav ul ul {
    /* Votre code CSS /
}


Pour tous les éléments du sous-menus que vous souhaiteriez personnaliser, il faudra précéder les éléments de la même chose que ci-dessus. Par exemple :

Pour la ligne du sous-menu :
nav ul ul li {
    /* Votre code CSS */
}


Pour le texte du sous-menu (lien) :
nav ul ul a{
    /* Votre code CSS */
}


N'hésitez pas à nous signaler toute anomalie.

424 appréciations
Hors-ligne
Merci beaucoup, c'est une excellente idée !
Très belle journée

108 appréciations
Hors-ligne
Merci B4E !

Cela fonctionne à merveille et c'est indéniablement un plus.

Bonne journée à vous !

2044 appréciations
Hors-ligne
Bonjour Réseau BP

ah oui c'est chouette ! je n'avais pas encore vu cette nouvelle fonction en action, comme tu dis indéniablement un plus !

40 appréciations
Hors-ligne


beaucoup !

Il y a du boulot pour appliquer ceci dans mon blog. Les premiers essais n'ont rien donné. Cela fait un bon bout de temps (des années) que je n'ai plus touché à tous ces codes .



40 appréciations
Hors-ligne


ça m'a pris 6 heures, j'ai dû changer le système de design (du Master aujourd'hui trop compliqué pour moi, au Rapid plus abordable et agréable) et refaire tout le blog, mais à la fin je suis satisfait.

J'ai pu mettre une bonne base que je pourrai ajuster au fur et à mesure.

Merci encore pour la possibilité d'avoir les sous-menus.


82 appréciations
Hors-ligne
Bonjour,

Merci  pour la mise en place de cette nouvelle fonctionnalité, j'ai aussitôt essayé :



Seul problème c'est que le menu est décalé vers le bas par rapport aux autres menus de la barre de navigation et je n'arrive pas l'aligner.


Philippe
Fluctuat Nec Mergitur

82 appréciations
Hors-ligne
Bonjour,

Sans rien toucher au CSS et alors que le master design reflète bien l'image ci-dessus, je découvre aujourd'hui ceci :



Qu'est ce qui se passe ?
Fluctuat Nec Mergitur

82 appréciations
Hors-ligne
C'est à ne rien y comprendre.
Je viens de retourner dessus et le blog est redevenu normal
Fluctuat Nec Mergitur

640 appréciations
Hors-ligne
Bonsoir Gpm,

Je viens de me balader sur ton site à l'instant et je vois comme sur ta première capture d'écran.

Petite précision j'utilise google chrome.

Bonne soirée. Cordialement.  

297 appréciations
Hors-ligne
Bonsoir,

La navigation s'affiche normalement, si ce n'est le problème de décalage de l'élément "cartes".

Tu peux corriger ce problème en ajoutant la propriété "vertical-align: middle;" à la classe nav li dans ton CSS (c'est aux environs de la ligne 20, m'a-t-il semblé voir).

82 appréciations
Hors-ligne
Bonsoir ,

Merci pour le déblocage, ça marche.

Par contre cela ne fonctionne pas pour le moteur de recherche qui lui reste décalé 
Fluctuat Nec Mergitur

82 appréciations
Hors-ligne
Merci Thalie d'avoir regardé,

Bonne soirée

Philippe
Fluctuat Nec Mergitur
Vous ne disposez pas des permissions nécessaires pour répondre à un sujet de la catégorie News de Blog4ever.

Inscrivez-vous au blog

Soyez prévenu par email des prochaines mises à jour

Rejoignez les 5724 autres membres