how to change hamburger icon in brooklyn to say Menu

Highlighted
New Member
6 0 0

Hello,

 

in mobile view in Brooklyn, the menu collapses into a hamburger icon. I want to change the hamburger icon to say the word "Menu" next to it. 

For example the minimal theme does this by default, not sure why brooklyn doesn't have it.

Please help.

Thank you.

0 Likes
Highlighted
Shopify Staff
Shopify Staff
41 0 4

Hi Daniel!

In your admin, head to Online Store > Themes and in the top right of the theme, there should be a "..." button. Click that and then choose "Edit HTML/CSS".

Open up the theme.liquid file, search for this section of code: 

<span class="icon icon-hamburger" aria-hidden="false"></span>

and replace it with

<span class="icon icon-hamburger" aria-hidden="true"> Menu </span>

That should add the word Menu beside the hamburger icon and look something like this: 

For Shopify created themes like Brooklyn though, you can also always reach out to support@shopify.com for a hand - we would be happy to try and help!

Cheers

Isabeau

0 Likes
Highlighted
New Member
3 0 0

Hi Isabeau

I have the same request in Brooklyn but I do not see that line of code in the theme.liquid file?

the nearest i can find is: 

div class="drawer__close">
          <button type="button" class="icon-fallback-text drawer__close-button js-drawer-close">
            <span class="icon icon-x" aria-hidden="true"></span>
            <span class="fallback-text">{{ 'cart.general.close_cart' | t }}</span>

 

Any help please 

Stuart

0 Likes
Highlighted
New Member
6 0 0

Hi! I have the same issue, I cant find that line of code in the theme.liquid. Perhaps you can give us an updated answer for this?

0 Likes