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.
Thank you so much!! I was looking for this! So happy to have found this page!
Hi Wen,
You’re welcome
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. 😊
I figured it out! Thanks again for the code 😊
Tried this one but it shows https://prnt.sc/CuSdbQ31fDL8
I’m using Slide In Menu in header, any idea how to fix this?
Try to clear the static CSS cache in Divi > Theme Options > Builder > Advanced
still not working
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?
using the theme builder version, fyi
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.
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