Comment ajouter WordPress Mega Menu à votre site

Publié: 2019-12-27

De nos jours, les Mega Menus sont incontournables pour les sites de commerce électronique. Les utilisateurs y sont habitués et cela facilite grandement la navigation. C'est pourquoi, dans ce guide, nous vous montrerons comment ajouter un méga menu WordPress à votre boutique.

Qu'est-ce qu'un Mega Menu et à quoi sert-il pour nous ?

Un méga menu est un élément essentiel lorsqu'il s'agit d'améliorer l'expérience utilisateur de votre site Web. La simple existence d'un menu déroulant dynamique capable de boucler la navigation de votre site change la donne. Vos visiteurs ne se sentiront pas perdus lors de la navigation sur votre site Web si vous utilisez un méga menu. De même, placer des liens de navigation corrects, ajouter des pages supplémentaires à votre menu et même des sous-sections pour votre site devient une tâche facile. Que vous ajoutiez des pages de boutique ou des produits ou même que vous placiez des éléments Map sur votre menu, tout devient beaucoup plus facile à gérer lorsque vous utilisez un méga menu.

Comment ajouter un méga menu sur votre site WordPress - navigation sur le site photo stock

L'ajout d'un menu Mega fait toute la différence lorsqu'il s'agit d'améliorer l'expérience utilisateur sur votre site Web. L'idée est de créer une navigation compacte pour toutes les pages nécessaires. Et en même temps, présentez-le d'une manière qui ne semble pas écrasante. De plus, vous pouvez implémenter vos méga menus de plusieurs manières :

  • Pour présenter le contenu vedette
  • Comme une simple section pour montrer les produits à venir
  • Placer dans les blogs, éléments Web uniques, tableaux de planification nécessaires

Fournir des informations fiables et conclure la navigation sur le site Web n'a jamais été aussi facile.

Quadlayers vous propose donc ce guide pour vous aider à ajouter un méga menu WordPress à votre site Web d'une manière digeste et facile à comprendre.

Comment ajouter un méga menu à votre site WordPress

Ce tutoriel vous aidera à activer votre méga menu sur votre site WordPress . À cette fin, nous utiliserons un plugin tiers. Il existe un large éventail d'options disponibles sur le marché, chacune avec ses avantages et ses inconvénients. Certains d'entre eux sont gratuits, certains sont premium, certains sont plus faciles à utiliser tandis que d'autres sont un peu plus compliqués.

Si vous voulez en savoir plus, vous pouvez consulter notre liste des meilleurs plugins Mega Menus. De plus, cet article met en évidence les points forts des meilleurs plugins disponibles.

Pour cette démonstration, nous utiliserons le plugin WordPress QuadMenu. Il est extrêmement simple à configurer et à personnaliser, et il est livré avec un large éventail de fonctionnalités notables. Ceux-ci inclus:

  • Interface facile à utiliser
  • Incroyable compatibilité des thèmes et plugins tiers
  • Conception mobile d'abord entièrement conçue pour être prête pour la rétine
  • Éléments de menu flexibles et uniques
  • Quatre préréglages uniques au choix avec des options de personnalisation supplémentaires
  • Outils de développement dédiés

ajouter le méga menu WordPress Quadlayers

Ainsi, si vous ne l'avez pas encore vérifié, nous vous recommandons fortement d'utiliser QuadMenu comme option viable pour ajouter un méga menu WordPress à votre site Web.

Comment installer Quad Menu

Donc, avant de commencer notre processus de construction de notre méga menu, nous allons d'abord devoir installer notre plugin. Cliquez simplement sur la section Plugins de votre tableau de bord WordPress, puis cliquez sur Ajouter un nouveau en dessous. Ensuite, utilisez la barre de recherche en haut à droite pour rechercher QuadMenu et cliquez simplement sur Installer maintenant . Après cela, le bouton devrait devenir Activer , et vous pouvez cliquer dessus à nouveau pour activer votre plugin QuadMenu WordPress.

ajouter un méga menu wordpress - ajouter un nouveau plugin

Comment ajouter un méga menu sur votre site WordPress - quadmenu activate

Comment configurer QuadMenu

Une fois que vous l'avez installé, la liste QuadMenu devrait apparaître sur votre barre latérale du tableau de bord WordPress . Cliquez dessus pour accéder à l'interface du plug-in QuadMenu et vous serez accueilli par la page du plug-in, qui vous demandera de le configurer en l'activant dans vos emplacements de thème.

Pour ce faire, cliquez simplement sur le lien Options qui vous est fourni ou cliquez sur Options sous QuadMenu dans la barre latérale de votre tableau de bord.

Pour activer le méga menu, cliquez simplement sur chaque section de thème et cliquez sur Activé dans l'option Intégration comme indiqué ci-dessous.

Comment ajouter un méga menu sur votre site WordPress - intégration quadmenu Vous pouvez également choisir le thème pour activer le méga menu sur la même page. QuadMenu vous permet d'activer des méga menus sur différents emplacements thématiques répertoriés dans la configuration.

Comment personnaliser et construire votre méga menu WordPress

Maintenant que vous avez configuré QuadMenu, vous pouvez l'ajuster et le personnaliser pour votre magasin. La première chose que vous pouvez faire est de créer un menu. Pour cela, passez la souris sur QuadMenu dans la barre latérale de votre tableau de bord et cliquez sur Menus . Ensuite, suivez ces étapes simples :

  • Donnez un nom à votre menu et cliquez sur Créer un menu .

Comment ajouter un méga menu sur votre site WordPress - créer un nom de menu

  • Complétez les paramètres de votre menu. Choisissez l' emplacement d'affichage que vous souhaitez utiliser pour votre méga menu. Vous pouvez choisir un menu horizontal ou vertical et activer un menu mobile, un menu social, un menu de pied de page ou un menu étendu de bureau.

Comment ajouter un méga menu sur votre site WordPress - emplacements des paramètres de menu

  • Une fois que vous avez choisi les options souhaitées, cliquez sur Enregistrer le menu .

Ajout d'éléments de menu à votre méga menu

Après avoir enregistré le menu, vous pouvez continuer et y ajouter des éléments de menu. Pour cela, vous pouvez simplement utiliser la colonne Ajouter des éléments de menu à gauche et choisir les pages, publications ou catégories que vous souhaitez ajouter à votre méga menu. De plus, vous pouvez ajouter des URL personnalisées en cochant les pages/articles/catégories nécessaires.

ajouter un méga menu wordpress - ajouter des éléments de menu

De plus, QuadMenu vous donne la possibilité de choisir les liens, les pages et les publications que vous souhaitez dans vos menus. Vous pouvez même utiliser un onglet de recherche astucieux sur chaque section pour trouver facilement le contenu de votre méga menu.

Les liens personnalisés vous permettent d'ajouter des liens vers divers contenus vers lesquels vous souhaitez diriger le trafic.

Une fois que vous avez coché tous les éléments de menu que vous souhaitez ajouter à votre méga menu, cliquez sur Ajouter un menu pour créer votre méga menu WordPress. Vous pouvez également réorganiser l'ordre des éléments du menu en les faisant glisser de haut en bas sur la fenêtre à votre droite.

Cliquez sur l'élément de menu nécessaire dans la colonne de droite pour modifier l'ordre de l'élément. Vous pouvez même le configurer pour qu'il soit un sous-menu de la même colonne. À quel point cela est cool!

S'habituer à QuadMenu et ses personnalisations

Le vrai point fort de QuadMenu est son grand nombre d'options de personnalisation. Bien que la configuration de votre menu WordPress soit extrêmement simple, la personnalisation est également un facteur important à prendre en compte. Maintenant que nous savons comment ajouter un méga menu WordPress à votre site, voyons ce que vous pouvez faire pour lui donner plus de saveur.

Survolez la liste de QuadMenu sur votre tableau de bord WP et cliquez sur Options . Vous verrez qu'il existe des tonnes d'options de personnalisation qui relèvent de différentes catégories, des mises en page aux dimensions du menu, en passant par le rembourrage, les animations, etc.

Maintenant, approfondissons certaines des options les plus importantes que vous pouvez activer pour votre méga menu.

Personnaliser votre Méga Menu

Tout d'abord, la disposition et l'alignement.

  1. Sous Options , cliquez sur Thème par défaut
  2. Outre Menu , vous recevrez cinq dispositions de menu au total. Choisissez celui que vous aimez
  3. Sélectionnez un alignement de menu approprié qui change en fonction de la disposition de votre menu
  4. Cliquez sur Enregistrer lorsque vous avez terminé

Comment ajouter un méga menu sur votre site WordPress - thème d'option de menu

Maintenant, personnalisons notre menu en ajoutant des arrière-plans, des couleurs et en personnalisant notre logo.

  1. Cliquez sur Menu sous Thème par défaut
  2. Choisissez entre les options d'arrière-plan de la barre de navigation
  3. Choisissez la couleur BG et la couleur du texte que vous souhaitez que votre arrière-plan ait
  4. Personnalisez la hauteur et la largeur du menu en dessous
  5. Cliquez sur Enregistrer

Comment ajouter un méga menu sur votre site WordPress - couleurs du menu

Et c'est à peine effleuré, sur la même page de personnalisation du menu, vous pouvez personnaliser les logos, les liens, les icônes et bien plus encore.

De plus, vous pouvez personnaliser les menus mobiles, la typographie, les animations et même ajouter du CSS personnalisé. QuadMenu vous permet également d'importer/exporter ces personnalisations afin que vous puissiez ajouter les mêmes conceptions de méga menu sur plusieurs sites Web. Expérimentez-les tous pour trouver les bonnes options pour votre méga menu.

Conclusion

Et maintenant vous savez comment ajouter un Mega Menu à votre site WordPress. Les méga menus peuvent être très utiles et vous aider à améliorer l'expérience utilisateur. Cependant, s'ils ne sont pas utilisés correctement, ils peuvent également confondre vos visiteurs et les submerger avec trop d'options. C'est pourquoi vous devez toujours garder à l'esprit vos clients lors de la conception et de la personnalisation de votre menu pour obtenir les meilleurs résultats.

Avez-vous des expériences à partager ? Faites-nous savoir dans la section commentaire ci-dessous!