Need to add the word "Menu" Above Hamburger Menu

[WS92657]

Hello,

I am using the Boundless theme. I need to add the word "Menu" above the hamburger menu. The hamburger menu in the code links to an image. So if I just search for "hamburger" in the code I do not find it. Just an image link to a picture of a hamburger menu. Any help is appreciated.

Thank you

[OTM]

Hi, @WS92657 ,

This is Evita from On The Map.

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss.liquid->paste bellow code in the bottom of the file.

span.icon.icon-hamburger:after {
    content: 'Menu';
    position: absolute;
    top: 0px;
    font-size: 14px;
    left: 14px;
}

Best,
Evita

[WS92657]

I tried what you suggested but there was still no "Menu" text above the menu. It looked exactly the same as before

[Qualitycheck]

Hello,
Hope you are doing well.

You can give your store access to us we will fix it for you.

Free of cost 

[OTM]

Can you add your store URL? In demo theme it works fine: https://prnt.sc/pe0dnm

I'm guessing some classes are different than the original theme.

[Levush]

@OTM Hey There, sorry to bother. Your piece of script worked out for my theme, although i need something slightly different. I need to move the hamburger menu button down to the center of the page instead of having it on the top left. any chance you could help me with that?

[suyash1]

@Levush - can you please share your website link? 

[Levush]

hey @suyash1, it is levu.sh 

pw: 123456

only thing is, i was able to write the CSS on my own to get the hamburger button to the middle just fine, but i ended up scraping the idea because it ends up not looking good either on mobile or desktop depending on the exact position i choose. you think you could help me write a code that would make this behavior only happen in mobile mode? (hamburger button only centered when on mobile but regular location on desktop) <--- actually not even sure this idea would be any good. i wish i could figure out a way to make the hamburger button a floating moveable button but that's way too much coding i feel like.

[suyash1]

@Levush - not able to check as right click don't work and it shows legal notice

[Levush]

@suyash1  my bad, please try now

[suyash1]

@Levush 

what is account login? not able to see hamburger menu on mobile view

[Levush]

@suyash1   try these credentials on mobile

Email: test@test.com

Password: test123

[suyash1]

not able to right click or f12

[tanika]

hi ,

I enter that code but it didn't work for me. any idea why?

[suyash1]

@tanika - hello, can you please share your website link?

[adkato1976]

Does this method depend on the theme being used? I tried and received no result either. It is still the hamburger menu with no text. I am using the "simple" theme.

Here is the link to the site if you need it https://oneforallshop.com/

[suyash1]

@adkato1976 - do you want like this?

[adkato1976]

Yes that would be great! Or at least as hugged up close to it as possible. 

[suyash1]

@adkato1976 - please add this css to the very end of theme.scss file and check

nav.grid__item.small--text-center.medium-up--one-fifth:before {
    content: "Menu";
}

[adkato1976]

I believe this adds it to the mobile version as well as the desktop. Is there any way to have it specifically for the mobile version?

[suyash1]

@adkato1976 - remove previous css and try this

@media screen and (max-width:749px){
nav.grid__item.small--text-center.medium-up--one-fifth:before {
content: "Menu";}
}

[adkato1976]

You're an absolute genius!!!! That got it! Thanks SOOOOO much!!!!!

[suyash1]

@adkato1976 - welcome