Créer un Mega Menu moderne pour votre site avec TOWeb 14

Avec la version 14, TOWeb introduit la prise en charge native des Mega Menus. Ce type de menu, désormais courant sur les sites e-commerce et les sites riches en contenu, permet d’afficher bien plus qu’une simple liste de liens : images, titres, catégories et hiérarchies claires peuvent être présentés dès l’ouverture du menu.

L’objectif est simple : améliorer la navigation, faciliter l’accès aux pages importantes et rendre le site plus lisible, notamment lorsqu’il contient beaucoup de rubriques.

Un Mega Menu est un menu de navigation étendu qui s’ouvre généralement au survol ou au clic d’un élément du menu principal.
Contrairement à un menu classique, il peut contenir :

• plusieurs colonnes de liens
• des titres de catégories
• une image de présentation
• un court texte descriptif

Ce type de menu est particulièrement adapté aux sites :

• e-commerce
• vitrines avec de nombreuses pages
• sites institutionnels ou associatifs
• sites proposant plusieurs services ou gammes de produits

Dans TOWeb 14, les Mega Menus sont intégrés directement au système de navigation du site.
Ils se configurent depuis la fenêtre de gestion du menu principal, accessible à tout moment via le raccourci CTRL + M.

Chaque Mega Menu peut être composé de :

• une première colonne optionnelle avec une image, un titre et un texte
• plusieurs colonnes de liens, chacune pouvant représenter une catégorie
• une structure entièrement personnalisable selon vos besoins

Il est possible de créer plusieurs Mega Menus sur un même site.

Le template WELLORA fourni avec TOWeb 14 inclut un exemple de Mega Menu pour sa section « Shop ».
Il illustre un usage typique avec une présentation visuelle suivie de 3 catégories de produits organisées en colonnes.

L’intérêt principal du Mega Menu est d’améliorer l’expérience utilisateur lorsque le site devient plus dense.

Concrètement, il permet de :

• réduire le nombre de clics pour accéder à une page
• rendre visibles des catégories importantes dès le premier niveau
• éviter les menus déroulants trop longs
• structurer clairement l’information

Sur un site e-commerce, il permet par exemple de présenter immédiatement les différentes gammes de produits.
Sur un site vitrine, il facilite l’accès aux services, pages clés ou informations pratiques.

L’apparence des Mega Menus peut être ajustée via l’éditeur CSS de TOWeb, dans la section dédiée au menu.
Il est notamment possible de personnaliser :

• les couleurs principales
• la largeur des colonnes
• les espacements
• l’alignement du contenu

Cela permet d’adapter le Mega Menu à l’identité visuelle du site, sans casser la cohérence globale du thème.

La création d’un Mega Menu se fait en quelques étapes :

1. Ouvrez la gestion du menu principal de votre site CTRL + M.
2. Cliquez sur le bouton Nouveau mega-menu (cf. image du précédent paragraphe "Les Mega Menus dans TOWeb 14").
3. Activez la case Présentation (facultative) si vous désirez que votre mega menu débute par une colonne contenant une photo et/ou un texte représentatifs de son contenu.
4. Cliquez sur le Liste de liens" de manière à ajouter vos liens et vos colonnes.
5. Ajustez enfin les styles des mega menus de votre site depuis l'élément Menu de l'éditeur CSS du Thème (cf. image du précédent paragraphe "Personnalisation et styles").
6. Publiez le site.

Le Mega Menu est particulièrement utile lorsque le site évolue dans le temps.
Il permet d’ajouter de nouvelles rubriques ou catégories sans remettre en cause toute la navigation existante.

Combiné aux autres nouveautés de TOWeb 14 (onglets, menu latéral, recherche rapide de rubriques), il constitue un outil efficace pour garder un site clair et organisé, même lorsqu’il devient plus complexe.

Pour effectuer la mise à niveau :

→ Installez TOWeb 14 sur l’ordinateur où se trouve votre version actuelle de TOWeb (1 à 13), lancez TOWeb 14 puis cliquez sur Licence / A propos dans l’étape Fichier.

→ Ou munissez-vous de votre dernière facture d’achat TOWeb et rendez-vous sur la page de mise à niveau de licence vers TOWeb V14

En cas de difficulté, vous pouvez contacter notre service commercial via notre formulaire de contact.