One of the biggest things missing from Squarespace 7.1 is the mobile breakpoint option. Back in the days of version 7, it was easy to show your mobile menu on desktop - just by dragging the breakpoint slider.
In 7.1, though, with that slider gone, so is the option to easily achieve this.
Luckily it can be done with a little bit of code.
So first you’re going to need to head to your CSS Editor in Squarespace (Design > Custom CSS)
Then take a copy of this CSS 👇
.header-nav {
display: none;
}
.header-actions {
display: none;
}
.header-burger {
display: flex;
}
.header--menu-open .header-menu {
opacity: 1;
visibility: visible;
}
Then paste it into the CSS editor and hit ‘Save’.
And that’s it!
Hi Carl, is there any way I can make the menu on the right side of the screen only, without the logo overlapping the menu?