08-11-2021 08:35 AM. Adding !important to after, if CSS doesnt work! I am looking to hide my hamburger menu and have the same menu displayed on all platforms, due to my menu only having one menu item. To get there, make sure youre logged into your account. If you are looking to create a hamburger menu on desktop in Squarespace 7.1, check out the plugin in my shop! We'll set the responsive hamburger menu's top to 0, left to -250px, and width to 200px. To change mobile menu hamburger Colour, simply copy the code below: Sets the Hamburger Menu Colour Site Wide. How to add custom font to your navigation menu items in Squarespace using CSS Method of CSS injection used: Universal The lovely Beatriz over at Thiry Eight Visuals has done it again!. In this tutorial, she is showing you exactly how to take the custom fonts youre currently drooling over (but arent native to Copy and paste the following CSS into DESIGN CUSTOM CSS. This means choosing one organizational structure and sticking with it. The following code is used in the video. Ask Question Asked 3 years, 7 months ago. Need to use Header display: none in custom css. It only uses pure HTML and CSS, so it is easy to learn from and understand what is happening. Squarespace 5, our legacy platform, doesn't allow permissions to be edited. Solution. The top of each page will have a big margin gap because normally you would want the content to start below the menu bar. Squarespace 7.0. into it for a cleaner look. How to Start Every New Squarespace Site from a Style Guide. URL of the site connected to the deceased users account. Replace the default hamburger menu icon with your own text. The question of how to use the mobile hamburger navigation on Squarespace sites comes up a lot, and it doesnt seem like many people have provided a concrete answer. 1: A hamburger menu appears on the top-right side of your app. Submit a request about a deceased customers website. Regarding the + on small screens, on line 9865 of the stylesheet there is this: #sidecarNav .folder label:before { content: '+'; padding-right: .25em; width: .75em; display: inline-block; } You could either remove that code, or just add this to the stylesheet: The notorious "Hamburger Menu" is now showing up more and more on large desktop and laptop screens.The actual navigation menu that summarizes the site structure requires clicking on it to show. Technically we only need to set left to -200px, since that's how wide the element is. /* This will handle styling the burger icon color*/ a [href = '/burger'] path {fill: black!important;} /* Removes the underline set by Squarespace active class */ a [href = '/burger'] {background: none!important;} /* This will handle styling the background color of the burger overlay */ better-burger {background: red;} /* This will handle styling the links inside the burger Angkaharian. I can send you whole snippet of the code if you need it. I have successfully managed to hide my hamburger menu in the Shopify Debut theme. Left Sliding Responsive Hamburger Menu. Re: Remove navigation hamburger menu I'm in a similar situation, except I want to take away the hamburger and have the full menu displayed across the banner. In this video, I show you how to change the colour of the hamburger button sitewide as well as how to set different colours for when the menu is opened and closed. We are here to take the guesswork out of your financial management and empower you to scale your business faster and more profitably than ever before. From your Squarespace account, go to the Custom CSS Editor. Once uploaded, click the file to generate a URL you can use. Click the white button that says EDIT SITE HEADER button. The Porto theme features include: unlimited colors, widgetized home page, over 600 fonts to choose from, Here's one method. Next.