On mobiles I would like to change the hamberger to text

Is it possible to change the layered hamburger icon/image to text that says

so when you click the word menu the menu slides out

Hello There,

Thanks for writing in!

To change the layered hamburger icon/image to text that says “-Menu-”, please add the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r)

#x-btn-navbar .x-icon-bars:before {
    content: "-Menu-";

We would loved to know if this has work for you. Thank you.

http://staging1.kidsmagicworld.com.au/zxxx/ shorten this down to mobile size

I put the css into appearance>>>>customize>>>>additional css and it does not work (yes cleared caches)6

I am using Pro not x

Hi there,

That will actually make things much easier. Please follow the steps below:

1- Add the Navigation Dropdown element to the header builder.
2- Click on the Toggle tab to see the toggle related options of the Navigation Inline:

3- Then check the options to find the Graphic Setup section. Turn that off as you do not want the hamburger menu:

4- Then turn the Text Setup on and add the text you want to show:

5- It depends on your desire to set up the style, but I would prefer to make the border-radius 0 and the box-shadow 0 so you will see only the text on not the button like section:

6- The last part will be to make the toggle section width a little bit larger to force the container show all of the text. I found out that the 4 em is the proper value:

Basically you have unlimited options to change the style and how the Navigation Dropdown element is set up. The part I mentioned is only for the toggle section. You can have much more stuff regarding the dropdown and other settings. I strongly encourage that you play with the options or check the article I linked at the beginning of the reply.

I suggest that you bookmark this page and first thing first search for the information there before submitting a support thread, as you will find good information there.

Thank you.

thank you very much

Hi @b960a518-a049-4215-9,

You’re most welcome.

Feel free to ask us again.


ok I got menu happening which is good

I know how to change the font color to white- how do I make the button background color iether transparent or the same blue as the bar http://staging1.kidsmagicworld.com.au/zxxx/ (I am playing with revolution slider so scroll down a bit and use a narrow browser)

Hi There,

Thanks for writing in again!
I am not sure exactly the question here. Can you please let us know what exactly you are having the issue.
What I am looking at the site is in this screenshot.


actually i just fount the answer thank you for looking

Glad you’ve sorted it out.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.