How to Hide the Hamburger Menu on Mobile in Squarespace
If you’re a Squarespace web designer, you don’t know you may need to hide the hamburger menu from the mobile version of your Squarespace website until it actually happens to you.
If you are a DIYer designing your own website, you’re probably thinking, “Why doesn’t Squarespace provide a feature that allows you to hide the hamburger menu from mobile?”
I’ve been building Squarespace websites for a while now, and only just recently did I come across a situation where I needed to hide the hamburger menu on the mobile version of the Squarespace website.
So…..in this blog post, I’m going to show you how to hide the hamburger menu from the mobile version of your Squarespace website using a code snippet.
This is Why I Want to Hide the Hamburger Menu From Mobile
You might be wondering why you would even want to hide the hamburger menu from your Squarespace website.
In my case, I created a single-page website for a client. Due to the nature of the business, the website has been designed primarily for mobile functionality.
My client wants everything to be done from the landing page, so eliminating the hamburger menu was crucial.
How to Hide the Hamburger Menu
In your dashboard, go to Website > Website Tools (it’s at the bottom) > Custom CSS and add the code snippet below:
/* hide hamburger menu */ .burger-inner { visibility: hidden; }
Now toggle over to mobile view and check your work. The hamburger menu should now be hidden.
Was this helpful?
Have you ever had a situation where you needed to hide the hamburger menu from the mobile version of your Squarespace website? Do you have any suggestions for this use? Tell me about it in the comments. 👇
This page contains affiliate links
My Insta
@jenxwebdesign
Like this post?