Comment supprimer le menu principal de Divi ?

Mis à jour le 23/07/2019 | Publié le 15/07/2019 | 22 commentaires

Dans certains cas, vous pourriez avoir besoin de supprimer le menu principal de Divi. C’est une fonctionnalité possible en un seul clic, faut-il encore savoir où elle se trouve !

Dans cet article, je vous propose de découvrir comment supprimer l’affichage du menu principal de Divi sur une seule page ou sur le site entier.

Vous verrez que c’est très facile et que vous n’avez pas besoin d’être développeur pour y parvenir.

Voici le programme :

  1. Pourquoi supprimer totalement le menu principal de Divi ?
  2. Supprimer le menu de Divi sur une seule page
  3. Supprimer le menu de Divi sur tout le site
  4. Pour aller plus loin avec cette fonctionnalité…

Annonce : cet article contient des liens d’affiliation que vous reconnaitrez facilement. Les liens classiques sont en violet et les liens sponsorisés sont en rose.

1 – Pourquoi supprimer totalement le menu principal de Divi ?

Selon votre projet, vous pourriez avoir besoin de cacher le menu principal de votre site. Il s’agit généralement du Header qui comprend le menu de navigation.

Dans quels cas pourriez-vous avoir besoin de cacher le menu de votre site :

Cas n°1 : pour créer une « Landing Page » efficace

Les Landing Pages sont souvent utilisées à but commercial. Elles sont des pages créées dans un but précis : vendre !

Une Landing Page doit donc être une page « sans distraction » afin que l’internaute n’est qu’un seul choix : cliquer sur le bouton « Call-to-Action » qui « va bien ».

Vous avez donc besoin d’indiquer un chemin particulier à votre lecteur, sans qu’il puisse se rendre à un autre endroit de votre site, sauf vers la boutique ou vers le formulaire d’inscription.

Dans ce cas, cacher le menu principal de votre site est très important pour optimiser la conversion. C’est le but premier d’une Landing Page !

Dans ce cas, vous aurez donc besoin de supprimer le menu principal de cette page en particulier.

Cas n°2 : pour créer un menu personnalisé

Certaines de vos pages pourraient afficher un menu différent du menu principal de votre site.

Selon les besoins de votre projet, cette fonctionnalité peut s’avérer primordiale.

Alors, sur ces page, vous pourriez cacher le menu principal de Divi et faire apparaître un menu totalement différent.

Dans ce cas, il est évident que vous ne pouvez pas afficher 2 menus différents sur une même page… et donc, vous aurez besoin de supprimer le menu primaire de Divi pour afficher un menu secondaire, préalablement créé à l’onglet Apparence > Menu.

Cas n°3 : pour afficher le menu à un autre endroit de votre page

Il est aussi possible que vous trouviez le menu principal de Divi « pas à votre goût ». Il est possible que son affichage et son emplacement ne corresponde pas à vos attentes.

Même si le header de Divi offre diverses fonctionnalités, vous pourriez envisager que celui-ci apparaisse à un autre endroit de votre site. Par exemple : après une image plein écran.

Cela est également possible : il suffit de supprimer le menu principal de Divi et d’insérer un module « Menu Plein Écran » au sein de votre layout, à l’endroit que vous souhaitez…

Savez-vous que vous pouvez tester Divi gratuitement ? Rendez-vous sur cette page et cliquez sur « TRY IT FOR FREE »

2 – Supprimer le menu de Divi sur une seule page

Supprimer le menu de Divi sur une seule page est un jeu d’enfant !

supprimer le menu de Divi
Supprimer le menu principal de Divi en 1 clic
  1. Rendez-vous sur l’édition de la page à modifier. Pour cet exemple, il s’agit de la page d’accueil.
  2. Allez à l’onglet « Document »
  3. Allez au sous-onglet « Attribut de Page »
  4. Dans le champ « Modèle », sélectionnez « Blank Page » puis mettez à jour votre page.

C’est tout ! À présent, la page que vous venez de modifier n’affichera plus le menu principal de votre site.

Quant au reste de votre site, le menu principal apparaitra toujours.

3 – Supprimer le menu de Divi sur tout le site

Il est possible que vous cherchiez à supprimer le menu principal sur la totalité des pages de votre site.

Cela peut être nécessaire si vous utilisez une section spécifique comprenant un module de menu, et que cette section est utilisée sur chaque page de votre site.

Dans ce cas, cela pourrait-être embêtant d’éditer chaque page une à une pour cocher l’option vue au chapitre précédent.

Vous pourriez donc agir sur toutes vos pages en une seule fois :

supprimer le menu de Divi sur tout le site
Supprimer le menu de Divi sur tout le site
  1. Rendez-vous dans le menu Apparence > Personnaliser > CSS Additionnel
  2. Ajoutez ce simple bout de code :
#main-header {
 display: none;
 }

#page-container {
 padding-top: 0px !important;
 }

Une fois que vous aurez enregistré vos modifications (pour cela, cliquez sur « Publier »), vous pourrez constater que le menu principal de votre site a disparu de toutes vos pages.

4 – Pour aller plus loin avec cette fonctionnalité…

À présent, vous savez comment masquer le menu principal de votre site. Vous allez donc pouvoir imaginer de nouveaux designs pour vos prochaines mises en page !

J’ai plein d’idées pour vous… Je vous propose de découvrir ces articles relatifs qui pourront vous aider à réaliser des layouts originaux :

supprimer le menu principal de Divi
remove main menu Divi

860 mots

3

Ça devrait vous plaire aussi :

Effet zoom sur image avec texte cliquable

Effet zoom sur image avec texte cliquable

Cet article vous explique comment obtenir simplement un effet zoom au survol des images avec un texte et un lien cliquable. Pas besoin d’extension, Divi permet de le faire facilement !

22 Commentaires

  1. Mireille Dubreuil

    J,ai dû me résigner à utiliser l’extension suggérée, mais elle fonctionne très bien… MERI !

  2. Lycia Diaz

    Salut Mireille,
    Quelle extension exactement ?
    😉

  3. Florent

    Bonjour
    je débute sous divi, et je voudrais enlever  » accueil et uncategorized » du menu header pas défaut.
    Cordialement

  4. Lycia Diaz

    Salut Florent… Je pense que tu es également débutant sur WordPress, je me trompe ? Car effectivement, la réponse n’est pas dans Divi mais dans WordPress… Tu dois créer un menu et l’affecter à l’emplacement principal. Tu pourras mettre ce que tu veux dedans. Tout cela se passe à l’onglet Apparence > Menu 😉

  5. florent

    Merci Lycia, je vais regarder ça.

  6. mourad anane

    salut, j’ai un problème quand je met le code dans css additionnel le menu disparu mais quand je sort de personnaliser le theme le menu revient. je ne sais pas
    pourquoi ?

  7. Lycia Diaz

    Salut Mourad,
    Là je ne vois pas, peut-être une histoire de mise en cache (plugin de cache ou mise en cache du navigateur).

  8. Nicolas

    Bonjour, merci pour l’astuce ! Malheureusement le footer disparaît aussi… Comment faire?

  9. Lycia Diaz

    Ah bon ? C’est bizarre… Il faut inspecter le code CSS de ta page dans ton navigateur et agir seulement sur le header et non le footer. Sinon, le mieux est de construire ton header avec le Thème Builder de Divi …

  10. Fal

    Bonjour, je souhaite integrer un widget de Trip Advisor (indiquant que le site est recommandé par TA) dans la barre de menu en haut de mon site ou sur un côté dans la partie haute de ma page d’accueil mais je ne trouve aucune possiblité de l’intégrer. Je ne connais pas grand chose au code css non plus pouvez vous m’aider ? Merci d’avance. Fal

  11. Lycia Diaz

    Salut,
    Il faut voir comment est composé le code de Trip Advisor. Est-ce un script ? Le module code pourrais te servir 😉

  12. Ouioui

    Bonjour,

    Tout d’abord merci pour votre excellent article.

    De mon côté j’ai un souci avec le menu. Peu importe le thème que j’utilise, mon menu disparait quand j’active Divi builder.
    Quand je désactive l’extension « Divi Builder » dans la liste de mes extensions, bizarrement tout revient à la normal 🙁

    Ce que je souhaite c’est de garder mon menu principale de wordpress et de modifier le reste avec Divi Builder.

    Avez-vous une idée svp ?

    Merci de votre aide.

  13. Lycia Diaz

    Salut Ouioui ! Tu utilises le Divi Builder sur quel thème ? Y aurait-il une option cochée comme « blank page » ce qui ferait disparaître ton menu. Mais c’est bizarre. Il y a peut-être un conflit quelque part.

  14. Sergio80

    Bonjour Lycia,
    merci pour ce partage.
    J’ai supprimé le menu (blank_page) mais dans ce cas le menu latéral n’apparaît pas non-plus.
    Comment faire pour n’avoir que le menu latéral ?
    Merci
    Sergio80

  15. Lycia Diaz

    Salut Sergio,
    Si tu mets une « blank page » effectivement, ton menu disparait totalement. Du coup, je ne sais pas si cela pourrait être corrigé avec une en-tête globale avec le Thème Builder ?

  16. Amandine

    Bonjour Lycia,
    Je souhaiterai pour ma page boutique supprimer totalement mon menu principal pour mettre un second menu (donc le cas n°2). Cependant que je vais sur document, attribut de la page, il m’est indiqué page parente et non modèle. Est ce que ça aurait changé avec des mises à jour ?

    Merci,
    Amandine

  17. Lycia Diaz

    Salut Amandine.
    La page boutique est une page « spéciale ». De ce fait, le champ « modèle » n’est pas disponible ici. Je te conseille alors de passer par le thème Builder pour créer cette page :
    1/ Divi > Theme Builder > Nouvelle Template > Page Boutique
    2/ Tu crées une entête personnalisée avec le module « menu » et tu choisis le menu que tu veux afficher (le second menu : il doit déjà être créé)
    3/ Tu construis le corps de ta page : il suffit de placer le module « publier un contenu » et le contenu de ta page boutique actuelle apparaîtra. Sinon, tu peux construire ta page boutique pas à pas avec le module « boutique » et d’autres modules de ton choix.
    Voilà 😉

  18. Amandine

    Merci Lycia !

  19. Tara

    Bonjour Lycia, votre site est génial pour moi qui débute depuis quelques jours avec Divi et qui ne maîtrise pas encore totalement WP.

    Je cherche à faire un menu principal d’une façon très différente de ce que l’on voit habituellement avec Divi et après beaucoup de recherches je me demande si cela est vraiment possible… Ou si j’ai passé les limites du possible avec mon imagination débordante…

    Je souhaite faire un menu situé en haut de mon site et sur deux lignes, le premier emplacement du menu (ligne du haut du menu) sera pour mener à la partie la plus « importante » de mon site et en dessous je souhaite placer 4 autres accès pour diverses pages. Savez-vous s’il existe un moyen de faire cela directement sur Divi ?

    Merci pour votre retour qui grâce à votre connaissance de Divi et WordPress sera très précieuse pour ma création de site 🙂

  20. Lycia Diaz

    Salut Tara, merci !
    Oui, si j’ai compris ce que tu veux, oui c’est possible.
    En fait, tu dois aller à l’onglet Apparence > Menu et créer 2 menus. 1 tu l’assignes en tant que Menu Principal et l’autre en tantg que Top Menu. Ensuite, tu customises ton menu avec les options possibles, comme indiqué ici https://astucesdivi.com/entete-menu-divi/.
    Sinon, avec le Thème Builder, tu peux tout faire, ton imagination sera servie 😉

  21. Jérôme

    Bonjour Lycia,
    Je souhaite pouvoir faire apparaitre un menu différent selon la page sur laquelle je me trouve (3 menus possibles au total).
    Savez-vous si cela est possible ?
    Merci 🙂
    Jérôme

  22. Lycia Diaz

    Salut Jérôme oui c’est possible, il suffit d’utiliser le Thème Builder. Tu assignes un header different à des pages spécifiques, c’est très simple

Soumettre un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

Pin It on Pinterest

Shares
Share This