How to replace the Hamburger button with “MENU” on Squarespace

Last updated on May 29th, 2020 at 06:22 am.

Watch the video for the step by step guide.

To add this code into your Squarespace, go to Settings ,

then Advanced . Then go into Code Injection .

Add the following code. And save

<style>
 .top-bar, .middle-bar, .bottom-bar {display:none;}
 .mobile-nav-toggle {margin-right:1rem !important; }
 .mobile-nav-toggle.fixed-nav-toggle { opacity:0; }
 .mobile-nav-toggle::after {
 content: 'MENU';
 margin-left: -2rem;
}
 .mobile-nav-open .body-overlay { cursor: pointer;}
 </style>

In case it doesn’t work for you, ensure that the classes for

the elements are the same as they are up there. Otherwise

edit the classes accordingly.

Watch, how to duplicate a squarespace Web Page.

To learn more about HTML and CSS ,click the button below: