Hamburger menu in mobile version not showing

Store Design
1

HI, I am using the brooklyn theme for my website. I have recently added a code to keep the header in a fixed position while scrolling.

After that, the hamburger menu on the mobile site has not been working since. There is no drop down menu when i click the hamburger menu. I have tried to adjust the settings, but do not dare to touch the code without supervision… Did i press something wrong or accidentally delete something?

Also, my product pictures on the home page and collection page are almost white. But it is fine on the product page…can this be fixed?

Please help me :disappointed_face: the launch of the store is soon and i do not want to redo the whole website :disappointed_face:

This is my store: swishswans.com {p/w: eumaur}

2

Hi @salad

Thanks for the post.

Remove this CSS on theme.js and add this CSS on the theme.scss

#SearchDrawer {
  z-index:1001;
}

.site-header {
  position: fixed;
  z-index:1000;
  left:0;
  right:0;
  -webkit-box-shadow:0px 2px 4px 0px rgba(0,0,0,.1);
  -moz-box-shadow:0px 2px 4px 0px rgba(0,0,0,.1);
  -ms-box-shadow:0px 2px 4px 0px rgba(0,0,0,.1);
  -o-box-shadow:0px 2px 4px 0px rgba(0,0,0,.1);
  box-shadow:0px 2px 4px 0px rgba(0,0,0,.1);
}

#PageContainer {
  padding-top: 80px;
}

@media screen and (max-width: 749px) {
#PageContainer {
  padding-top: 70px;
}
}
3

Thank you for your speedy reply. However, this does not seem to solve the problem.

The hamburger menu is still not working.. and even though the header is still fixed, the announcement bar is not and it leaves a gap in between :disappointed_face:

I am at a lost at what i can do… please help me (again)

4

Hi @salad

I need your store login details. Yes, I know your login details are confidential. For this second option, I have added your store to my Shopify partner account so I will check your code easily and manage what you think about it?

5

Hello @Vikas_Chovatiya

My hamburger menu is not showing on the mobile version. Can you help me?

https://newdaysports.com/pages/brandservices

PW: CoschStudio

6

Hi @NDS

  1. Go to Online Store->Themes->Edit code
  2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
button.Header__Icon, .Header__FlexItem [href="/account"], .Header__FlexItem [href="/search"], .Header__FlexItem [href="/cart"] {
    display: block !important;
}
7

Hello @Vikas_Chovatiya ,

Thanks! But I don’t want the Account Search or Cart Items to be showing. I only want the hamburger menu that displays the main many options (Services, Partners, Become a Partner).

For this set of 3 pages I have created a second header & what I need is for he mobile version to show the menu with this 3 items only.

Does it make sense?

I also created a second sidebar-menu section in the coding section, but dont know how to link it to the second header section.

Thanks!

8

Hi @Vikas_Chovatiya ,

Did you get a chance to take a look? I really need some help here :slightly_smiling_face:

Thanks!

9

Hi @NDS

  1. Go to Online Store->Themes->Edit code
  2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
button.Header__Icon.Icon-Wrapper.Icon-Wrapper--clickable.hidden-desk {
    display: block;
}
10

Hello @Vikas_Chovatiya ,

That shows a menu but it doesn’t show the menu for this page. the menu here should only have 3 sections: services, partners, and become a partner.

I did create a second sidebar section for this menu as this is a second header. Could it be because I need to link the second sidebar menu to the second header section that is displaying for this page?

Thanks again!