[Limited Time Offer] Get 40% off MEMBERSHIP PLUS before it's gone! 👉Get This Deal
Mark Hendriksen Logo

How To Add The Text “Menu” Next To The Divi Hamburger Menu

Mark Hendriksen | April 28, 2021 | 12 Comments
Disclosure Note: Sometimes, I include links in my articles that can earn me money. It won't cost you anything, but it helps me pay for coffee ☕ so I can make more helpful content.

In this little tutorial, we are going to add the text “Menu” or any text you like next to the hamburger icon to make it more descriptive.

For the default menu

For the default menu you can use this snippet and place it in Divi > Theme Options > CSS .

/* ### menu text for default menu ### */
#et_mobile_nav_menu:before {
    content: 'MENU';
    font-size: 14px;
    position: absolute !important;
    bottom: 29px;
    right: 40px;
    color: #000000;
}

You can change the text Menu between the quotes in something else if you like.

For the menu in the Theme Builder

Use this snippet if you have build a custom menu in the Theme Builder. You can place the snippet in Divi > Theme Options > CSS.

/* ### menu text for menu with theme builder ### */
.et_mobile_nav_menu:before {
    content: 'MENU';
    font-size: 14px;
    position: absolute !important;
    top: 4px;
    right: 40px;
    color: #000000;
}

And that’s it for this tutorial.

You might also like…

Article by

Mark Hendriksen

I am the founder here at MarkHendriksen.com a blog website for Web design, WordPress, and Divi. Learn more about Mark

12 thoughts on “How To Add The Text “Menu” Next To The Divi Hamburger Menu”

  1. Thank you so much for this! Is there any way to change the word on different pages? I want the page name to be on each page. 😊

    Reply
  2. Great. And super nice presentation too. I appreciate not having to read your life history to get this snippet. One thing… It would be great if the word “menu” was also linked to trigger the menu. Possible?

    Reply
    • Hi Kc,

      That is a good question and I do not have a solution for that right now. But I will see if there is a possibility for this.

      In the coming weeks, I will be releasing some new menu tutorials so I will see if I can come up with a solution for this.

      Reply
      • Awesome. Thank you. I’ll also be thinking about how to solve this. Seems like it’s probably going to require some php or javascript

        Reply
  3. I am trying to use this for the Slide In Menu on the Desktop version. Do I need to modify the code to get it to work? I have tried it in 4.22.2 and haven’t had any luck (likely user error).

    Reply

Leave a Comment

0 Shares
Share
Pin
Tweet