How can I make the mobile header transparent in Brooklyn theme?

Hi! Does anybody have any clue how to make just the mobile header transparent? My site’s desktop header is transparent already but the mobile one won’t change and its almost impossible to see my logo. Im using the Brooklyn theme. Would appreciate any advice anyone has!

Hi @Artemisia ,

Please share your store URL and if your store is password protected then please provide password too.

So that we can help you.

Thank you.

Hi! I actually figured out the mobile issue on my own! However, is there a way to make a transparent logo for collection list pages? Essentially making the collection list image the header? my logo cant be read on those pages. I’ll find and add my password if anyone can help!

Hi @Artemisia ,

If yes, can you send us your password and we can help you check. ^^!

Thank you!

@AvadaCommerce

my url is: https://artemisianewyork.com/

and the password is waivad

Hi @Artemisia ,

You can follow the instruction below:

  1. Go to Online Store->Theme->Edit code
  2. Asset->/theme.scss->paste below code at the bottom of the file:
.template-list-collections .header-container {
    display: none !important;
}

If you feel like my answer is helpful, please mark it as a SOLUTION. Let me know if you have any further questions.

@AvadaCommerce That works for the home page but I want to be able to put the same type of header on my individual collection pages. Any advice for that?

@AvadaCommerce Basically is it possible for me to edit my header for singular pages? I cant figure it out for the life of me but I also have no coding experience.

Hi @Artemisia ,

Can you send us a mockup so we can visualize what you mean?

Thanks