Comment ajouter un nouvel élément à votre menu de navigation Shopify (Tout lien, tout menu, mobile inclus)

Ajouter un élément de menu dans Shopify ne prend qu’une minute ; le vrai défi consiste à choisir le bon type de lien, à placer l’élément au bon endroit et à vérifier qu’il s’affiche parfaitement sur toutes les interfaces utilisées par vos clients (en-tête pour ordinateur, tiroir mobile, pied de page et menus créés par des applications).

Si l’ajout dans l’interface est rapide, les liens doivent être bien positionnés pour s’afficher correctement sur chaque écran.

Ce guide explique comment ajouter tout type de lien à tout menu Shopify, le positionner correctement et vérifier son affichage.

Quick answer: add a new item to your navigation menu

Pour ajouter un nouvel élément à votre menu de navigation Shopify, rendez-vous dans Contenu > Menus dans votre administration, ouvrez le menu utilisé par votre thème, cliquez sur Ajouter un élément de menu, saisissez un titre, sélectionnez un lien dans la liste déroulante, puis cliquez sur Ajouter et enregistrez le menu.

Suivez ces 6 étapes dans votre interface Shopify :

1. Dans votre panneau d’administration Shopify, allez dans Content > Menus (Shopify Help Center).
2. Cliquez sur le menu affiché par votre thème actif, généralement intitulé Main menu (Shopify Help Center).
3. Cliquez sur Add menu item (Shopify Help Center).
4. Dans le champ Name, saisissez le libellé visible en boutique.
5. Dans Link, choisissez la destination dans la liste plutôt que de coller une URL (Shopify Help Center).
6. Cliquez sur Add, puis sur Save menu pour valider vos modifications (Shopify Help Center; Fudge.ai).

D’anciens tutoriels citent parfois “Online Store > Navigation”, mais Content > Menus est l’emplacement actuel.

Before you add the item: create the destination first

Créez et publiez toujours votre page, collection, produit ou politique en amont avant de créer son lien dans le menu.

Sélectionnez vos destinations dans la liste Shopify : modifier l’URL ou lier manuellement peut rompre la connexion et provoquer une erreur 404 (Shopify Help Center).

Gardez un libellé (Name) court et familier. Des noms clairs comme “Chaussures de running” facilitent l’orientation.

Pick the link type for your new item

Cliquer sur Link affiche la liste définie des types de liens Shopify (Shopify Help Center). Choisir le bon type garantit un accès fiable.

Link to an external site or an email address

Pour lier un site externe, collez l’URL complète dans Link, attendez que la destination apparaisse, puis sélectionnez-la (Shopify Help Center).

Pour un lien email, saisissez mailto:[email protected] dans le champ Link (Shopify Help Center).

Coller des URL pour des pages internes peut briser la liaison et causer des erreurs 404 (Shopify Help Center).

Concept illustration : choisir un type de lien pour un nouvel élément de menu et le voir apparaître dans le menu de la boutique.

Decide where the item goes: top level, inside a dropdown or the footer

Les éléments de menu apparaissent en boutique exactement dans l’ordre défini dans votre administration (Shopify Help Center).

Move the item and change its order

Pour modifier l’ordre d’affichage des éléments :

1. Cliquez et maintenez l’icône de poignée (⠿) située à côté du nom de l’élément (Shopify Help Center).
2. Faites glisser l’élément verticalement vers le haut ou le bas jusqu’à la position souhaitée.
3. Relâchez l’icône, puis cliquez sur Save menu.

Put the item inside a dropdown

Pour placer un élément dans un menu déroulant, glissez-le sous l’élément parent puis déplacez-le vers la droite pour l’indenter.

Shopify autorise jusqu’à deux niveaux de sous-menus sous un élément principal (Shopify Help Center). Indiquez # si le parent ne doit mener nulle part.

La plupart des thèmes traitent les titres déroulants comme des boutons et non des liens (Shopify Help Center). Si votre catalogue grandit, pensez à planifier une structure de menu multi-niveaux.

Add the item to the footer menu

Les liens secondaires de service trouvent naturellement leur place dans le pied de page plutôt que dans l’en-tête.

Dans Content > Menus, ouvrez Footer menu, cliquez sur Add menu item et choisissez votre lien. Le pied de page n’affiche que les éléments principaux (Shopify Help Center).

Shopify recommande au maximum sept éléments principaux dans le menu principal pour éviter l’encombrement (Shopify Help Center).

One item, every surface: where your new item shows up

Enregistrer un élément ne garantit pas un affichage identique partout. La visibilité dépend de la surface et du thème.

Shopify inclut par défaut un menu principal et un pied de page sur chaque page (Shopify Help Center). Leurs emplacements varient selon le thème (Shopify Help Center).

Sur mobile, de nombreux thèmes regroupent le menu principal dans un tiroir latéral sous une icône hamburger ; l’emplacement exact dépend du thème.

L’étude de Nielsen Norman Group montre que le menu hamburger n’est pas universel et que masquer la navigation dégrade l’expérience utilisateur sur ordinateur comme sur mobile (NN/g). Explorez la navigation mobile au-delà du hamburger ou un menu d’icônes pour catégories visuelles.

Les applications tierces créent leurs menus en interne sans passer par l’administration (Shopify Help Center). Pour un menu géré par une application, ajoutez l’élément dans celle-ci.

Concept illustration : où un nouvel élément de menu peut apparaître dans l’en-tête d’ordinateur et le tiroir mobile.

New item not showing? Five quick checks

Si un élément nouvellement créé n’apparaît pas en boutique, passez en revue ces cinq points :

1. Avez-vous cliqué sur Save menu ? Les modifications ne s’appliquent qu’après avoir enregistré (Shopify Help Center; Fudge.ai).
2. Le thème utilise-t-il le bon menu ? Dans votre éditeur de thème, confirmez que l’en-tête et le pied de page pointent vers le menu édité (Shopify Help Center).
3. L’élément enfant est-il indenté ? Assurez-vous que l’élément déroulant est glissé sous le parent et visiblement en retrait (Shopify Help Center).
4. Votre thème est-il ancien ? Certaines versions anciennes ne supportent pas trois niveaux de menu ou plus (Shopify Help Center).
5. Le menu est-il géré par une application ? Les applications créent leurs menus en interne sans lire l’administration (Shopify Help Center).

Si un lien génère une erreur 404, veillez à sélectionner la page dans la liste plutôt que de saisir une URL manuelle (Shopify Help Center).

Trade-offs: when not to add another item

Chaque élément supplémentaire charge l’attention des visiteurs. Multiplier les liens sans mesure nuit à la lisibilité.

Shopify conseille de limiter le menu principal à sept éléments principaux (Shopify Help Center). Regroupez les liens proches dans un menu déroulant plutôt que d’ajouter des onglets.

Les menus déroulants imposent des compromis : beaucoup de thèmes transforment l’élément parent en simple bouton (Shopify Help Center), empêchant l’accès direct à la page de collection parente.

Sur mobile, masquer la navigation dégrade l’expérience utilisateur (NN/g), rendant les sous-liens profonds faciles à manquer.

Considérez d’autres emplacements : les liens secondaires conviennent au pied de page qui n’affiche que les éléments principaux (Shopify Help Center). Les caractéristiques de produits conviennent peut-être mieux comme filtres. Découvrez les limites du menu de thème par défaut.

Adding the same item to a Navi+ menu

Shopify précise que les applications de navigation créent leurs menus dans l’application au lieu d’utiliser les réglages de menu de l’administration (Shopify Help Center). Navi+ Tab Bar, Mobile Menu et Mega Menu fonctionnent ainsi : ajouter un lien dans Content > Menus ne met donc pas à jour l’arbre Navi+.

Pour ajouter un élément dans Navi+ :

1. Ouvrez le tableau de bord Navi+ dans Shopify et sélectionnez votre menu.
2. Cliquez sur + Add item ; les nouveaux éléments s’ajoutent en bas (Navi+ Documentation).
3. Glissez l’élément vers le haut pour changer son ordre.
4. Glissez vers la droite pour en faire un enfant de l’élément supérieur (Navi+ Documentation).
5. Cliquez sur Save ; les modifications n’apparaissent aux clients qu’après enregistrement (Navi+ Documentation).
6. Pour la Tab Bar, publiez le menu afin de l’afficher en ligne (Navi+ Documentation).

La profondeur dépend du type de menu, pas du forfait (Navi+ Documentation) ; la Tab Bar supporte 3 niveaux (Navi+ Documentation). Apprenez à créer un menu pour ordinateur dans une application.

If you want the same new item to sit in a bottom tab bar or a mega menu on top of your theme menu, Navi+ Tab Bar & Mega Menu lets you add it in the app’s menu tree, drag it into place, save and publish.

Action checklist

Vérifiez ces 8 points avant de considérer votre élément comme prêt :

• Destination existante : Page, collection, produit ou politique publiée dans l’administration.
• Choix dans la liste : Destination sélectionnée dans la liste plutôt qu’une URL saisie.
• Type de lien adapté : Type de lien conforme à la ressource ciblée.
• Position voulue : Maximum 7 éléments principaux, sous-menu indenté ou pied de page.
• Menu sauvegardé : Sauvegardé dans l’éditeur Content > Menus de Shopify.
• Sections vérifiées : En-tête et pied de page du thème pointent vers le bon menu.
• Test smartphone : Vérification sur téléphone réel de l’accessibilité tactile dans le tiroir.
• Menu d’application mis à jour : Élément ajouté dans le tableau de bord de l’application.

FAQ

Où puis-je ajouter un nouvel élément de menu dans Shopify ?

Dans Shopify, allez dans Content > Menus, sélectionnez votre menu actif (souvent Main menu), puis cliquez sur Add menu item (Shopify Help Center).

Un élément de menu peut-il pointer vers un site externe ou un email ?

Oui. Pour un site externe, collez l’URL dans Link, attendez l’affichage de la destination et validez (Shopify Help Center). Pour un email, indiquez mailto:[email protected].

Combien de niveaux puis-je imbriquer ?

Un élément principal peut comporter jusqu’à deux niveaux déroulants imbriqués, soit trois niveaux au total (Shopify Help Center). Certains thèmes anciens ne gèrent pas trois niveaux (Shopify Help Center).

Pourquoi mon nouvel élément ne s’affiche-t-il pas ?

Les éléments absents résultent d’un menu non enregistré, d’un mauvais menu dans le thème ou d’un menu géré par une application (Shopify Help Center; Fudge.ai). Vérifiez aussi l’indentation (Shopify Help Center).

Puis-je créer un menu déroulant dans le pied de page ?

Non. Le menu de pied de page n’affiche que les éléments principaux et ne supporte pas de sous-menus (Shopify Help Center).

Le nouvel élément apparaîtra-t-il automatiquement sur mobile ?

Le menu principal apparaît sur mobile, mais sa présentation dépend du thème (souvent dans un tiroir latéral) (Shopify Help Center). Pour une application, ajoutez l’élément dans celle-ci (Shopify Help Center).

Sources

• Shopify Help Center: Add, remove, or edit menu items in your online store
• Shopify Help Center: Set up drop-down menus in your online store
• Shopify Help Center: Understanding navigation
• Nielsen Norman Group: Mobile Navigation: Hamburger or Not?
• Navi+ Documentation: Item Create & Manage
• Navi+ Documentation: Tab Bar & Bottom Navigation
• Navi+ Documentation: Multi-level Structure
• Fudge.ai: How to Add a New Menu Item in Shopify