How to delete the Divi main menu?

Updated on 23/07/2019 | Published on 15/07/2019 | 22 comments

In some cases, you may need to delete the Divi main menu. It's a one-click feature, you still need to know where it is!

In this article, I suggest you discover how to remove the display of the Divi main menu on a single page or on the entire site.

You will see that it is very easy and that you don't need to be a developer to do it.

Here is the program:

  1. Why delete the Divi main menu completely?
  2. Delete the Divi menu on a single page
  3. Delete the Divi menu on the whole site
  4. To go further with this feature....

Advertisement: This article contains affiliate links that you will easily recognize. The classic links are in purple and sponsored links are in pink.

1 - Why delete the Divi main menu completely?

Depending on your project, you may need to hide the main menu of your site. This is usually the Header which includes the navigation menu.

In which cases might you need to hide your site's menu:

Case n°1: to create an effective "Landing Page

Landing Pages are often used for commercial purposes. They are pages created for a specific purpose: to sell!

A Landing Page must therefore be a "no distractions" page so that the Internet user is only one choice: click on the "Call-to-Action" button which "is fine".

You therefore need to indicate a particular path to your reader, without him being able to go to another part of your site, except to the shop or to the registration form.

In this case, hiding the main menu of your site is very important to optimize the conversion. That's the primary purpose of a Landing Page!

In this case, you will need to delete the main menu from this particular page.

Case 2: to create a custom menu

Some of your pages may display a different menu from the main menu of your site.

Depending on the needs of your project, this functionality may be essential.

So, on these pages, you could hide Divi's main menu and make a completely different menu appear.

In this case, it is obvious that you cannot display 2 different menus on the same page... and therefore, you will need to delete Divi's primary menu to display a secondary menu, previously created in the tab Appearance > Menu.

Case n°3: to display the menu at another location on your page

It is also possible that you will find Divi's main menu "not to your liking". It is possible that its display and location may not meet your expectations.

Although the Divi header offers various featuresyou might consider having it appear elsewhere on your site. For example: after a full screen image.

This is also possible: simply delete the Divi main menu and insert a "Full Screen Menu" module into your layout, where you want...

Did you know that you can test Divi for free? Go to this page and click on "TRY IT FOR FREE"

2 - Delete the Divi menu on a single page

Deleting the Divi menu on a single page is child's play!

supprimer le menu de Divi
Delete the Divi main menu in 1 click
  1. Go to the editing of the page to be modified. For this example, this is the home page.
  2. Go to the "Document" tab
  3. Go to the "Page Attribute" sub-tab
  4. In the "Template" field, select "Blank Page" and update your page.

That's all! That's all! Now, the page you just modified will no longer display the main menu of your site.

As for the rest of your site, the main menu will always appear.

3 - Delete the Divi menu on the whole site

You may want to remove the main menu on all pages of your site.

This may be necessary if you use a specific section with a menu module, and this section is used on each page of your site.

In this case, it might be annoying to edit each page one by one to check the option seen in the previous chapter.

You could therefore act on all your pages at once:

supprimer le menu de Divi sur tout le site
Delete the Divi menu on the whole site
  1. Go to the menu Appearance > Customize > Additional CSS
  2. Add this simple piece of code:
#main-header {
 display: none;
 }

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

Once you have saved your changes (click on "Publish" to do so), you will see that the main menu of your site has disappeared from all your pages.

4 - To go further with this feature....

Now you know how to hide your site's main menu. You will therefore be able to imagine new designs for your next layouts!

I have lots of ideas for you... I suggest you to discover these related articles that can help you to realize original layouts:

supprimer le menu principal de Divi
remove main menu Divi

860 words

3

You should like it too:

Effet zoom sur image avec texte cliquable

Zoom effect on image with clickable text

This article explains how to get a simple zoom effect when hovering over images with text and a clickable link. No need for an extension, Divi makes it easy!

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