À quoi ça sert
Websource Mega Menu sert à composer les menus de votre boutique sans code. Vous ajoutez des catégories, des marques, des produits, des pages ou des liens libres, vous les rangez par glisser-déposer, et vous voyez le résultat dans un aperçu.
- Les listes (sous-catégories, marques, pages d'une rubrique, produits) se remplissent et se mettent à jour toutes seules.
- Sur ordinateur, le menu est une barre avec sous-menus au survol. Sur téléphone, il devient un tiroir ou un accordéon.
- Chaque élément peut recevoir une icône et une pastille (« Nouveau », « -20 % »…).
- Vous travaillez sur un brouillon enregistré automatiquement. La boutique ne change qu'au clic sur Mettre en ligne.
Installation
- Le module est installé et activé avec le thème Websource. Sinon, ouvrez Modules > Gestionnaire de modules, cliquez sur Installer un module et envoyez
websourcemegamenu.zip. - À l'installation, un menu Menu principal est créé et mis en ligne dans la barre de navigation, avec vos catégories.
- Ouvrez Apparence > Websource Mega Menu.
- Si le menu d'origine de PrestaShop s'affiche encore, désactivez le module
ps_mainmenu.
Prise en main en 5 minutes
- Ouvrez Apparence > Websource Mega Menu. L'écran Mes menus liste vos menus.
- Sur Menu principal, cliquez sur Modifier.
- À gauche, dans Structure du menu, glissez un élément par sa poignée pour le déplacer.
- Cliquez sur + Ajouter un élément, puis sur Un lien libre ou un titre.
- À droite, saisissez le Texte affiché et l'Adresse du lien. L'aperçu, au centre, montre le résultat.
- Dépliez Pastille flottante et saisissez « Nouveau » dans Texte de la pastille : la pastille apparaît au-dessus de l'élément dans l'aperçu.
- La mention « Enregistré automatiquement à … » confirme la sauvegarde du brouillon.
- Cliquez sur Mettre en ligne.
Sur la boutique de test, cet essai a été fait sur une copie hors ligne du menu (« Démo A — Menu de saison »), pour ne pas modifier le menu en ligne.
Réglages
Mes menus
| Réglage | Rôle |
|---|---|
| + Nouveau menu | Ouvre la fenêtre Créer un menu. |
| Emplacement | Rappel de l'endroit où le menu s'affiche. |
| En ligne / Brouillon | État du menu. |
| Interrupteur | Affiche ou masque un menu en ligne, sans le supprimer. |
| Modifier | Ouvre l'éditeur. |
| Dupliquer | Crée une copie hors ligne et l'ouvre dans l'éditeur. |
| Supprimer | Supprime le menu, après confirmation. |
Fenêtre Créer un menu :
| Réglage | Rôle |
|---|---|
| Nom du menu | Nom interne. |
| Où l'afficher ? | Barre de navigation, sur toute la largeur ; En-tête de la boutique ; Pied de page ; Je le place moi-même (code à copier). |
| Partir d'un exemple (catégories, marques, pages, visuel) | Cochée : le menu est prérempli avec le contenu de votre boutique. |
| Créer et commencer | Crée le menu et ouvre l'éditeur. |
Éditeur : barre du haut
| Réglage | Rôle |
|---|---|
| ← Mes menus | Retour à la liste. |
| Nom du menu | Modifiable. |
| Brouillon / En ligne | État ; à côté, l'heure du dernier enregistrement automatique. |
| ↶ ↷ | Annuler, rétablir. |
| Ordinateur / Mobile | Largeur de l'aperçu. |
| Mettre en ligne | Publie le brouillon. Le bouton indique ✓ En ligne quand il n'y a rien à publier. |
Éditeur : structure et ajout d'éléments
| Réglage | Rôle |
|---|---|
| Poignée ⠿ | Glissez pour réordonner, ou déposez sur un autre élément pour le ranger dedans. |
| + (sur un élément) | Ajoute un élément à l'intérieur. |
| + Ajouter un élément | Ouvre la fenêtre Que voulez-vous ajouter ?. |
Éléments proposés :
| Famille | Éléments |
|---|---|
| Votre boutique | Une catégorie de produits, Une marque, Toutes les marques, Un fournisseur, Un produit, Une liste de produits (nouveautés, meilleures ventes, sélection…). |
| Vos pages de contenu | Une page de la boutique (accueil, contact, promotions, plan du site, magasins…), Une page de contenu, Toutes les pages d'une rubrique. |
| Liens et visuels libres | Un lien libre ou un titre, Un titre de colonne, Une image avec texte et bouton. |
Éditeur : réglages d'un élément
Cliquez sur un élément de la structure. Les premiers champs dépendent de son type.
| Réglage | Rôle |
|---|---|
| Quelle catégorie ? (catégorie) | Catégorie liée. |
| Texte affiché | Libellé. Pour une catégorie, laissez vide pour reprendre son nom. Pour un lien libre, il est toujours à renseigner. |
| Ajouter automatiquement ses sous-catégories, Sur combien de niveaux ? (catégorie) | Remplit le sous-menu avec les sous-catégories, sur 1 à 3 niveaux. |
| Adresse du lien (lien libre) | https://…, /contact, mailto:…, tel:…. Laissez vide pour un simple titre sans lien. |
| Icône et texte — Icône (facultative), Choisir une icône | Icône de la bibliothèque, image ou SVG envoyé, ou emoji. |
| Que montrer ? | Icône + texte, Icône seule (le texte reste lu par les lecteurs d'écran), Texte seul. |
| Place de l'icône, Taille de l'icône | Avant ou après le texte ; de Très petite à Très grande. |
| Pastille flottante — Texte de la pastille | Par exemple Nouveau, -20 %, Promo. Vide : pas de pastille. |
| Position de la pastille | Flottante, en haut à droite de l'onglet, ou À la suite du texte. Dans un sous-menu, elle est toujours à côté du texte. |
| Couleurs de la pastille | Couleur d'accent du thème, Couleur principale du thème, Foncée, Claire, Verte, Rouge, Comme le menu, Personnalisées. |
| Forme de la pastille | Pastille arrondie, Angles adoucis, Rectangle. |
| Lien et position | Ouverture dans un nouvel onglet, lien « nofollow », place dans la barre (Normale, Au centre de la barre, À droite de la barre) et visibilité (Partout, Seulement sur ordinateur, Seulement sur mobile). |
| + Ajouter dans cet élément, ↑ Monter, ↓ Descendre, ⇥ Ranger dans le précédent, ⇤ Sortir d'un niveau, ⧉ Dupliquer, 🗑 Supprimer | Actions sur l'élément (alternative au glisser-déposer). |
| ← Réglages du menu | Revient aux réglages généraux. |
Éditeur : réglages du menu
Affichés à droite tant qu'aucun élément n'est sélectionné.
| Réglage | Rôle |
|---|---|
| Où afficher ce menu ? | Barre de navigation, sur toute la largeur ; En-tête de la boutique ; Pied de page ; Je le place moi-même (code à copier). |
| Présentation | Barre horizontale avec grands panneaux, ou Colonnes de liens (idéal en pied de page). |
| Couleur du menu | Clair, Foncé, Couleur principale de la boutique. |
| Taille des sous-menus | Petite languette sous l'élément (adaptée au contenu), Grand panneau à la largeur du site, Grand panneau sur toute la largeur de l'écran. |
| Position des éléments | À gauche ou Centrés. |
| Menu sur mobile | Menu « push » : tiroir qui repousse la page, ou Accordéon sous le bouton Menu. |
| Nom du menu pour les lecteurs d'écran (par langue) | Laissez vide pour reprendre le nom du menu. |
| Niveaux de sous-menus autorisés | De 2 à 6 (4 par défaut). |
Cas d'usage
Un grand panneau pour une catégorie riche. Dans les réglages du menu, choisissez Grand panneau à la largeur du site. Dans la catégorie, ajoutez des titres de colonne, rangez-y vos liens, puis ajoutez Une image avec texte et bouton pour mettre une offre en avant.
Mettre en avant les soldes. Ajoutez Un lien libre ou un titre, donnez-lui une pastille « -20 % » de couleur Rouge, et placez-le À droite de la barre.
Un menu de pied de page. Créez un menu avec l'emplacement Pied de page : la présentation passe en Colonnes de liens. Ajoutez Toutes les pages d'une rubrique.
Un lien visible seulement sur mobile. Dans Lien et position, choisissez Seulement sur mobile (par exemple pour un lien « Nous appeler » en tel:).
Placer un menu à un endroit précis. Choisissez Je le place moi-même (code à copier) et collez le code affiché dans le gabarit voulu.
Questions fréquentes
Mes visiteurs voient-ils mes modifications en cours ? Non. Seul Mettre en ligne publie le brouillon.
Que se passe-t-il si j'ajoute une sous-catégorie dans mon catalogue ? Elle apparaît seule dans le menu si la case Ajouter automatiquement ses sous-catégories est cochée. Le menu est mis en cache 15 minutes au plus.
Puis-je avoir plusieurs menus ? Oui, chacun avec son emplacement.
Le menu affiche-t-il des prix ? Non, jamais.
Le menu est-il traduisible ? Oui : libellés, pastilles, textes des visuels et adresses des liens libres se saisissent par langue. Les liens vers catégories, pages, marques et produits suivent la langue du visiteur.
Quelles images puis-je envoyer ? Visuels : 5 Mo au plus. Icônes : 1 Mo au plus, en SVG, PNG, JPG, WebP, GIF ou AVIF.
Dépannage
Deux menus s'affichent l'un sous l'autre. Deux menus en ligne ont le même emplacement, ou ps_mainmenu est encore actif. Masquez l'un des menus avec son interrupteur.
Mon changement n'apparaît pas sur la boutique. Vérifiez que le bouton indique ✓ En ligne et non Mettre en ligne.
Un sous-menu est vide. La catégorie n'a pas de sous-catégorie active, ou le nombre de Niveaux de sous-menus autorisés est trop bas.
L'aperçu de l'éditeur est très petit. Il montre le menu à échelle réduite. Utilisez Mobile pour vérifier la version téléphone, puis contrôlez sur la boutique après la mise en ligne.
En multiboutique, l'éditeur est bloqué. Choisissez une boutique précise en haut du back-office.
Désinstallation
- Si vous aviez désactivé
ps_mainmenu, réactivez-le pour garder un menu. - Ouvrez Modules > Gestionnaire de modules, puis sur Websource Mega Menu cliquez sur Désinstaller.
La désinstallation supprime tous vos menus. Pour les conserver, exportez le thème depuis Websource Theme Config, ou désactivez simplement le module.