Swap Folder name for Burger menu icon

Hello! Does anybody know how to swap Folder name (MENU) for Burger menu icon? And how can I style that burger icon?

Thank you so much!

Hi. If you share link to your site, we can help easier

copper-bullfrog-28wb.squarespace.com

Please let me know if you can open it 🙂 Thanks so much in advance!!

On 5/6/2022 at 3:32 PM, HandegardArkitektur said:

copper-bullfrog-28wb.squarespace.com

 

Please let me know if you can open it 🙂 Thanks so much in advance!!

What is access password?

EspenWebsite2022

Thank you!

On 5/9/2022 at 4:19 PM, HandegardArkitektur said:

EspenWebsite2022

 

Thank you!

Password is incorrect.

Can you check it again

https://copper-bullfrog-28wb.squarespace.com/

Changed it! Sorry it wasn't that one but now it is.

EspenWebsite2022

should work! thank you so much

On 5/12/2022 at 4:09 PM, HandegardArkitektur said:

Changed it! Sorry it wasn't that one but now it is.

 

EspenWebsite2022

 

should work! thank you so much

Add to Design > Custom CSS

/* Burger icon */
a.header-nav-folder-title:before {
    content: "\e030";
    font-family: 'squarespace-ui-font';
    font-size: 40px;
}
a.header-nav-folder-title {
    font-size: 0;
}

Amazing, thanks so much! Do you know how can I style the burger menu so it has a thinner stroke?

I have nested the menu pages into a folder, but in the phone version, inside the burger menu it appears the folder. Do you know how can I fix this?

Thank you so much for your time and help!! appreciate it a lot!

See attached what i mean:

As well, it appears like a thin line under the burger icon on desktop (not in the home page) Do you know how can I delete that?

Thanks so much!

On 5/18/2022 at 8:00 PM, HandegardArkitektur said:

See attached what i mean:

 

As well, it appears like a thin line under the burger icon on desktop (not in the home page) Do you know how can I delete that?

 

Thanks so much!

#1. Use this code

@media only screen and (max-width: 767px) {
  .header-menu-nav-folder[data-folder="root"] {
    display: none !important;
  }
  .header-menu-nav-folder-content .header-menu-controls {
    display: none;
  }
  .header-menu-nav-folder:not([data-folder="root"]) {
    transform: unset;
    transition: unset;
  }
}
a.header-nav-folder-title {
    background-image: none !important;
}

Tuanphan, you're amazing! Thank you so much

is there a way to make the background under the folder transparent?

On 4/26/2023 at 10:41 PM, DavidMoment said:

is there a way to make the background under the folder transparent?

Add to Design > Custom CSS

/* Dropdown transparent */
.header-nav-folder-content {
    background: transparent !important;
}