Comment créer un menu vertical dans WordPress

Envie de donner une touche plus moderne à votre site internet ?
Eh bien, remplacer un menu horizontal traditionnel par un menu vertical peut instantanément donner à votre site WordPress un look chic et moderne. De plus, un menu vertical peut améliorer l'expérience utilisateur aussi.

Mais comment créer un menu vertical dans WordPress ?

Eh bien, il existe plusieurs façons d’ajouter un menu vertical à votre site WordPress.

Dans ce blog, nous allons vous montrer comment créer un menu vertical dans WordPress et vous pouvez également créer un méga menu vertical.

Qu’est-ce que le menu vertical dans WordPress ?

Un menu vertical dans WordPress représente un collection de liens disposés dans un ordre vertical plutôt que le traditionnel horizontal. De nos jours, ce type de menu vertical WordPress est récemment devenu extrêmement populaire car il est plus convivial, notamment sur les appareils mobiles. 

Avantages de l'utilisation d'un menu vertical dans un site WordPress :

• Ces menus sont visuellement plus beaux 
• Facile à naviguer menu
• Maintenir le réactivité du site sur les appareils mobiles
• Vous pouvez ajouter plus de menus de niveau supérieur dans le menu vertical qu'horizontal
• Fonctionne très bien sur les sites de commerce électronique

Comment créer un menu vertical dans WordPress à l'aide d'Elementor et ElementsKit 

Voici le guide étape par étape sur la façon de créer un menu vertical dans WordPress. Vous aurez besoin d'un constructeur de pages. Élémentor et plugin WordPress de menu vertical – ElementsKit. Vous pouvez facilement créer un menu vertical WordPress si vous suivez les étapes ci-dessous :

Étape 1 : Installer Elementor et ElementsKit  

 Pour installer, connectez-vous à votre tableau de bord et

• Accédez à : Plugins ⇒ Ajouter un nouveau
• Rechercher Elementor / ElementsKit (un à la fois)
• Cliquez sur Installer maintenant

Après l'installation, cliquez sur le bouton Activer pour l'activer.

Étape 2 : Créez un menu pour votre menu vertical WordPress

Créons maintenant un menu. Pour cela, accédez à Apparence ⇒ Menu. 

Une fois sur la page de menu, vous devez

1. Cliquer sur Créer un nouveau menu
2. Indiquez un nom sous le Nom du menu option
3. Enfin, cliquez sur Créer un menu pour créer le menu.

Maintenant vous devez :

1. Sélectionnez le menu dans le menu déroulant
2. Cliquez sur Sélectionner
3. Cliquez sur la case à cocher du menu que vous souhaitez ajouter
4. Cliquez sur Ajouter au menu à ajouter au menu que vous choisissez
5. Enfin, cliquez sur Enregistrer le menu pour mettre à jour

Si vous disposez d'un menu à plusieurs niveaux, vous pouvez réorganiser les éléments de menu et cliquez sur le menu Enregistrer mettre à jour.

Étape 3 : Activer le widget de menu vertical d'ElementsKit

Aller vers ElementsKit ⇒ WIDGETS ⇒ Widget Menu vertical, allumer le widget et cliquez sur Enregistrer les modifications.

Étape 4 : Faites glisser et déposez le widget

Modifiez la page avec l’option Modifier avec Elementor. Alors recherche pour le widget Stylist List avec l'icône Ekit et simplement faites glisser et déposez le widget sur la page.

Étape 5 : Personnaliser les paramètres du menu vertical

Il est maintenant temps d'ajouter le menu que vous venez de créer ou celui que vous préférez à votre menu vertical. Vous pouvez le faire à partir du menu déroulant Sélectionner.

Si vous souhaitez transformer votre menu vertical Elementor en un bouton pliable, vous devez activer le bouton bascule. Une fois activé, vous pouvez modifier le titre du bouton bascule et pouvez également choisir d'ajouter des icônes sur les côtés gauche et droit.

Activez l'option Activer le survol et activez la bascule en survol (par défaut, cela fonctionne au clic.)

Étape 6 : Personnaliser le style du menu vertical

Il est maintenant temps de changer le style de votre menu vertical. Pour cela, passez à l’onglet style.

Développez l'option Conteneur de menu pour modifier le type d'arrière-plan, la couleur, l'emplacement, la deuxième couleur, l'ombre de la boîte, le rayon de la bordure, etc.

De même, vous pouvez modifier de nombreuses options de style sous les éléments de menu et les éléments de sous-menu.

Une fois que vous avez terminé toute la personnalisation, cliquez sur publier et voyez l'aperçu :

Comment créer un méga menu vertical dans WordPress à l'aide d'Elementor et ElementsKit 

Pour suivre ce didacticiel, vous devez vous assurer que le widget de menu vertical que vous avez activé précédemment est toujours activé.

Étape 1 : Activez les modules ElementsKit nécessaires 

Aller vers ElementsKit⇒Modules, activez à la fois Mega Menu et Header Footer Builder, et enfin cliquez sur Enregistrer les modifications pour mettre à jour.

Assurez-vous maintenant de créer un menu pour votre menu vertical en suivant les instructions étapes indiquées ci-dessus. 

Étape 2 : activez l’option ElementsKit Megamenu 

Une fois que vous avez terminé de préparer votre menu, cochez l'option ElementsKit Megamenu pour activer la fonction méga menu. Une fois que vous avez coché cette option, vous verrez l’option méga menu si vous survolez le menu.

Étape 3 : Convertir le menu en méga menu à l'aide d'ElementsKit 

Maintenant, pour convertir un menu simple en méga menu, survolez le menu et cliquez sur l'option méga menu. Alors activez le bouton bascule du menu Mega und cliquez sur Modifier Mega Menu Contenu. 

Cliquez maintenant sur l'icône Ekit, passez à l'onglet section, recherchez le méga menu puis choisissez le modèle de méga menu prédéfini que vous aimez. Une fois que vous l'avez inséré, vous pouvez le modifier selon vos besoins.

Une fois que vous avez terminé, cliquez sur mettre à jour pour enregistrer le menu. Répétez le même processus sur tous les menus pour lesquels vous souhaitez créer un méga menu. 

Et voilà vous avez réalisé votre méga menu. Vous pouvez utiliser le générateur de pied de page d’en-tête ElementsKit pour ajouter un méga menu à votre site Web. 

Pour plus de détails sur le méga constructeur de menus d'ElementsKit, consultez notre blog Comment créer un méga menu avec Elementor et ElementsKit. Vous pouvez également regarder l’ensemble du processus dans la vidéo ci-dessous :

Derniers mots

ElementsKit fait de la création d’un menu vertical dans WordPress une tâche extrêmement simple à exécuter. Bien qu’un menu horizontal soit une bonne chose, une modification du menu peut parfois améliorer l’apparence de votre site Web. Surtout si vous avez un site de commerce électronique, vous devriez essayer la fonctionnalité méga menu d'ElementsKit.

J'espère que vous avez trouvé le blog utile, si vous avez des questions concernant le plugin WordPress du menu vertical, n'hésitez pas à nous le faire savoir.