Crée un Méga Menu avec Divi

par | Jan 31, 2018 | Aller + Loin avec Divi, Documentation | 0 commentaires

Le menus Mega est un excellent moyen pour mettre en valeur tes catégories de menu pour en facilité leur compréhension.

Le menu Mega va permettre à tes utilisateurs de voir plus de liens à la fois sans être obligé de descendre dans le bas de ta page. Tes utilisateurs vont avoir une vue d’ensemble de tes services.

L’avantage d’un Mega Menus c’est que lorsqu’on survole le lien dans le menu, celui-ci va se déplier et ainsi afficher les liens et sous-menus parents supplémentaires dans le menu déroulant.

Allez on arrête les grands discours, et on passe à la technique.

Comment ajouter un menu Mega DIVI à votre barre de navigation

Connectez-vous à votre tableau de bord WordPress et allez dans Apparences > Menus .

Créer un mega menu avec DIVI

Crée ton menu avec par exemple 4 liens parents.

Sous ces 4 liens parents créent 3 liens enfants, que tu vas positionner avec un décalage par rapport à son parent.

Créer un Mega Menu avec le thème DIVI

Crée un lien supplémentaire, C’est le Grand-parent qui va veiller sur les enfants du Méga Menu.

Création du méga menu

Maintenant, Pour que ton Mega Menu soit au top, il va te falloir ajouter une classe CSS spéciale au lien principal de niveau supérieur appelé « Grand-parent Mega Menu ».
Pour celà il te faut activer une petite option en haut de ton tableau de bord. C’est option d’écran !
Il te faut cocher l’option CSS.

Je design mon mega menu DIVI

Tu vas ajouter une classe CSS au lien que tu viens de créer « Grand-Parent Mega Menu ». Clique sur la flèche sur la droite de l’élément de menu « Lien personnalisé » pour faire basculer les options de configuration supplémentaires. Tu vas trouver la zone de texte intitulée Classes CSS et et tu vas entrer la classe « méga-menu ».

Ajouter une class CSS au méga menu de Divi

Maintenant, lorsque tu recharge ta page, tu peux voir que ton menu précédent a été déplacé dans le menu « Grand-parent Méga-Menu ».
Il te restera plus qu’à contempler ton superbe menu.

Ajouter une class CSS au méga menu de Divi

0 commentaires

Soumettre un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *