Jump to content

Search the Community

Showing results for tags 'hamburger-icon'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • Forum
    • Welcome to the Forum
    • Customize with code
    • Commerce
    • Feedback on Your Site
    • Images & Videos
    • Pages & Content
    • SEO
    • Products
    • Resources
  • Colorado Designers's Topics
  • Squarespace Forum Club Guidelines's Topics
  • Austin, TX Designers's Club Discussion
  • New York City Designers's Club Discussion
  • Berlin Designers's Club Discussion
  • SEO Experts's Club Discussion
  • Photographers's Club Discussion
  • Graphic Designers's Topics
  • London Designers's Topics
  • Podcasters's Club Discussion
  • Custom Coding Help's Club Discussion
  • Atlanta, GA Designers's Topics
  • Seattle, WA Designers's Topics
  • San Diego, CA Designers's Topics
  • Dallas, TX Designers's Topics
  • Australia Designers's Club Discussion
  • Minnesota Designers's Topics
  • Minnesota Designers's Topics
  • Copywriters's Topics
  • France Designers πŸ‡«πŸ‡·'s Topics
  • France Designers πŸ‡«πŸ‡·'s Topics
  • Portland, OR Designers's Topics
  • Canadian Website Designers's Club Discussion
  • Los Angeles Designers & Devs's Club Discussion
  • South African Designers's Club Discussion
  • Brazil Designers's Club Discussion
  • Developers's Club Discussion
  • German Circle Members's Topics

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



About Me




Expert ID

  1. Hey! I'm using the new Squarespace 7.1 and am having some troubles finding any info on making the nav break at a certain point to enable the mobile hamburger icon for desktop. I don't want their typical nav for desktop, just wanting to have the hamburger icon across all devices. Thanks for any help! https://chameleon-porcupine-c7jc.squarespace.com/ password: 1234
  2. Hey guys - is there anyway to make the lines thicker on the hamburger menu icon on https://mandolin-spinach-fnj6.squarespace.com/ pword: 1234 Current code: //menu for web// .header .header-burger{display:flex} .header-nav, .header-actions {display:none} .header--menu-open .header-menu { opacity: 1; visibility: visible;} Thanks!
  3. Our website (www.great-marriages.org) switches the top navigation links into the hamburger menu when on mobile. I think this is intuitive but we have donors who complain that they can't find the donate button on mobile. Is there a way to make it so that the final navigation link (which goes to our Donate page) can show up on mobile outside of the hamburger menu? As a link or a button or whatever? I'm open to suggestions!
  4. Hi! We just launched our new website and unfortunately have found one of our most necessary features - the accordion/hamburger icon menu does not work on Apple devices (iPhones) that we've tested. Any help here? Works beautifully on PC and Android devices. Any help really appreciated! I'm not sure where to start with fixing this and our official launch is this weekend. (side note: this icon worked during dev/testing on iPhone before I connected my domain to our godaddy acct)
  5. Hi Guys, Hope all are well! I was wondering if anyone of you knows how to code/ integrate a hamburger drop down menu view option for monitor views? For now, squarespace supports a hamburger button on mobile view, but not on monitor view. Someone can help me?
  6. Site URL: https://studiofurks.com/ Hi, I wanted to make sure that on the mobile version my website, the 2 page links that I have would appear without the need of using the hamburger menu. Example of what I'd like: Link to current site: https://studiofurks.com/
  7. Hi all! Our website is for a hotel, therefore we have a floating widget at the top of all pages with date selections and a search link, which we want to keep. However when viewing on Mobile version the floating widget blocks our primary links when the hamburger drop down menu is opened. πŸ˜’ Anyone know how to work around this? I've tried maximizing the Line Height in the Mobile Menu: Primary > Font. This does lower the text under the widget to make it visible however results in all the links being spaced out too far from eachother (doesn't look good). Is there a way to make the Mobile Navigation Menu appear over this floating widget or to have all the navigation links in the hamburger menu start a few lines down? *Here is the widget code if needed: <script src="https://hotels.cloudbeds.com/widget/load/q4PLQx/float?newWindow=1"></script> Thank you!
  8. How can I force the desktop header (without the hamburger menu) on an iPad of width 1024px. My site: https://duck-blackbird-74nd.squarespace.com (currently public) Thx so much.
  9. https://www.vizniuk.com/navigation I need to delete the hamburger from the mobile version of the site. At the moment there is no linked pages, so hamburger is not shown. But the space is still taken by it. I want to move the cart icon more to the right, so it would be on a place hamburger should be. Thank you.
  10. Site URL: https://cindyclaudia.com Hi, can I ask the custom CSS to change the 'menu' to hamburger for mobile and tablet view? I'm using the Wexley template My site is cindyclaudia.com (password: 123456) *If possible, I'd like the 3 lines hamburger menu. But if not, the regular 2 lines is fine too. And next, I'd like to know how to make the menu content full screen when selected (on mobile and tablet) like the examples I attached. Thank you!
  11. Hi. I used some great code from this tutorial to make a hamburger menu on desktop. Suddenly, nothing happens when you click on the hamburger. I've used this code on multiple sites and none of them are work. I asked the developer if he changed the js at all. He got back to me and said he hadn't but was unable to help any further. Seeking any advice/guidance on how to fix this. I'm stumped. Thank you in advance!
  12. Hello, I want to invert the colours on my mobile header just on the homepage only from black to white. I've manage to do this for the desktop view but need done for the logo and hamburger on mobile. https://www.commonmanners.com/ password: common
  13. I'm using the following script to change the usual Nav in desktop mode to a hamburger menu - The client has requested this despite guidance otherwise. I've just added an e-commerce section to the site and when that is in place, and with a shopping cart selected to be in the header, two things happen. The hamburger menu icon moves to the left of the logo. The hamburger menu doesn't actually appear in the header. I know that this is because the script says to hide the header items/actions etc. Is there any way to keep both the hamburger menu and the shopping cart in the header on desktop mode.
  14. Hello! The hamburger Icon in the top right corner of my website has disappeared. I haven't changed any of my settings or added any CSS codes but the lines no longer appear on the mobile version of my site. The menu still appears when you tap the place the icon should be but there is no way for people to tell that there are more pages for them to explore. Please help! I have no idea how to fix this!
  15. Hi, I'm trying to get the Hamburger icon on the navigation bar to change to an X when hovering mouse over the menu and menu expands on desktop version (kind of like it does on the mobile version) I've tried a few css codes I found online but nothing working so far.. Anyone an idea how to do this? Website is https://pigeonhousedelgany.squarespace.com password: Peanuts Thank you, Annabelle
  16. Hi, I am using the code below to change the logo on the home page, however, the code effects the entire page so when i click the hamburger menu, the logo is white. I do not want that because it is not very visible. I want the logo to be white on the homepage but change back to black when you click on the hamburger menu like it does on the other pages. How can I do that? https://tlcdesign-sylvie.squarespace.com/home password: sylvie <style> .header-title-logo img { visibility: hidden; } .header-title-logo a { background-image: url(https://static1.squarespace.com/static/634facca9a1aa046ad910a6c/t/635193f56754c829ac99d578/1666290677453/172DB8AD-65EF-4986-BCF0-AEE53CCF6716.png); background-size: cover; background-repeat: no-repeat; background-position: center center; } </style>
  17. Hello lovely angels of Squarespace forum (and superhero @tuanphan) I added a custom image for the hamburger and also made the mobile menu active for desktop view. It's working pretty well, I'm just having issues with the alignment and size. I want to icon to be relatively large (around 90 px wide), but on smaller screen and on mobile, the icon gets cut off. I can't figure out how to move the icons to the left a little so it doesn't get cut off. Website: https://www.crystalmind.design/ PW: happydog THANK YOU SO MUCH! - Chloe Here is the code I used: // CUSTOM HAMBURGER /* Non-active burger */ .burger-inner:after { content: ""; background-image: url(https://static1.squarespace.com/static/5ee903c7326ba435104d57a9/t/6362909e6596c42839983790/1667403934287/Hamburger.png); background-size: 100px; background-repeat: no-repeat; background-position: right; background-color: transparent !important; display: block; width: 100px; height: 60px; } .burger-inner>div { display: none !important; } /* Burger when active */ body.header--menu-open .burger-inner:after { background-image: url(https://static1.squarespace.com/static/5ee903c7326ba435104d57a9/t/6364ff46b118c16557fff23c/1667563334640/Hamburger_1.png) !important; }
  18. PW: flagrant I just need another developer to help me see what I am not seeing. I am trying to add css to force the nav menu into a hamburger for desktop too, but for some reason it's on the left side of the logo? I think I just need another set of eyes on this to help me figure out whats happening. I want it on the far right side instead of the far left. This is the code I'm adding in, it's worked for me in the past but for some reason now it's not: .header .header-burger{display:flex} .header-nav, .header-actions {display:none} .header--menu-open .header-menu { opacity: 1; visibility: visible;} Thank you to anyone who gets a second to look.
  19. Site URL: https://www.voegelino.com/ Hi there I would like to change the hamburger menu icon into the text MENU. Any idea? I have a quite complicated set up with this menu and don't want to destroy anyting. Could anyone please help me? https://www.voegelino.com/ PW: orneverornow Attached you can find the custom code that is in the CSS. Thanks! Sibylle
  20. Site URL: https://www.waborihousetattoo.com.au/ Hey Guys, I'm having issues with the hamburger menu on mobile. I'm using an iPhone 11. After scroll the hamburger icon becomes un clickable..but only sometimes. I can’t pin point what is triggering this to stop working as sometimes you tap it and it opens, other times I tap it and nothing happens. Have tried to inspect on Chrome to see if something is overlapping it - can't find the issue. Is this a known issue? Any ideas? https://www.waborihousetattoo.com.au/ Thanks
  21. Site URL: https://www.nw-modern.com Hey everyone - brand new to this and working on a website for someone else. I am seeking the complete code to have my dropdown menu have the hamburger menu instead of "menu" as a title. I learned how to code using R and RStudio years ago, but I'm unfamiliar with CSS. If someone could provide a full script, I'd appreciate it! Thank you!
  22. I want to remove the hamburger menu icon on the mobile viewing, so having the header with only the logo. I'm adding the following code but it merger the header with the image that's supposed to be displayed under. I just want to remove the hamburger icon. <style> /* Hide burger */ button.Mobile-bar-menu { visibility: hidden }
  23. Site URL: https://www.rethinkhomes.com/ I have not done any edits or changes on this site for several months. But yesterday I went on to check why a client had not been able to find our social media icons. I discovered that our header and footer were missing. At first I thought it might be a custom CSS or code injection of some kind that stopped working. But after checking all places where I could have injected code, they were all empty. The only way I was able to even take screen shots of the header menu bar was by adding "safe" to the end of my SS site editing page URL https://rhombus-mandolin-jdrl.squarespace.com/config/safe and disable scripts. Can anyone help me figure out what has gone wrong.
  24. Site URL: https://www.reachnaz.com I need my hamburger menu to be white. It is currently black. This is the code that I am using for the menu. What do I need to change or add to make the menu white and not black. .header .header-burger{display:flex} .header-nav, .header-actions {display:none} .header--menu-open .header-menu { opacity: 100; visibility: visible; width: 30%; margin-left: 70%; box-shadow: -5px 5px 15px #000} div.header-menu-nav-item a { font-size: 20px !important; padding: 10px; } .header-menu-nav-item {line-height: 20px!important;} @media screen and (min-width:992px) { .header-menu-actions { justify-content: center !important; } .header-menu-cta { position: relative; top: -100px; } } @media screen and (max-width:991px) { .header--menu-open .header-menu { width: 100% !important; margin-left: 0 !important; } }
  25. Site URL: https://numomo.com/ Hi, I am setting up new site. The mobile view shows a default hamburger (or +) icon for the collapsed menu on mobile. Since the entire page is only a single page without no additional pages, no mobile menu is needed. I want to a) get rid of the mobile menu logo (the hamburger or +), and replace it with two social media icons, i.e. the Twitter and Instagram icons (just like on the desktop view). How can I do that?
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.