Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

Search the Community

Showing results for tags 'hamburger-icon'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • Forum
    • News and Announcements
    • Getting Started With Squarespace
    • Coding and Customization
    • Commerce
    • Selling & Scheduling Your Services
    • Feedback on Your Site
    • Images and Videos
    • Pages and Content
    • SEO and Marketing
    • Site Design and Styles
    • 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. 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!
  3. 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 }
  4. 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.
  5. 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; } }
  6. 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?
  7. Site URL: https://removed.com Just trying to throw up a really quick and dirty landing page to collect emails. On the mobile version, I notice the site displays a menu button on the type right. I tried playing around in the settings but all I get are options to change the aesthetic of the icon or some visual element but not to remove the icon entirely. We only have the landing page so it doesn't make sense to have a blank menu that has nothing and it looks unprofessional. I purchased the personal plan by the way. Edited to add the domain:
  8. Hello everyone, Can you please advise on how to force the mobile menu on a desktop? I am new to squarespace and trying to keep the hamburger menu on with all screen sizes. I'm using version 7.1 - and all online resources are based on a previous versions were you can edit mobile settings that are not available anymore. It would be great if you can suggest any tips or custom code. website: tarpon-reed-27ss.squarespace.com password: 1234 many thanks, Dario
  9. Site URL: http://rust-lavender-rxjl.squarespace.com Hi, My website has a hamburger menu and I used a custom code to implement it. The hamburger navigation looks fine on the desktop website but it looks different on mobile website. Can someone please help me make the navigation the same for the mobile as it is for the desktop website? Site URL: http://rust-lavender-rxjl.squarespace.com Site password: mallorykaye1 Thanks!
  10. Site URL: http://rust-lavender-rxjl.squarespace.com Hi, Can someone please help me make the hamburger icon left aligned on the desktop website and also the text that appears after you click on the icon needs to be smaller and left aligned. I have attached a photo of a mockup how it should look. Site password: mallorykaye1 I have used a custom code to implement the hamburger navigation in the website: .header .header-burger{display:flex;} .header-nav, .header-actions {display:none} .header--menu-open .header-menu { opacity: 1; visibility: visible; } Any help will be much appreciated! Thank you for your time!
  11. Site URL: https://www.tinanairpics.com/contact Hello, I'm trying to figure out how to make a mobile-view hamburger icon change from white to black on a particular page of a website. I've currently injected the following code into that particular page's header, to make the hamburger appear white on the pre-clicked version, as the page background itself is dark (unlike the rest of the pages on the site): <style> a.icon-hamburger::before { -webkit-filter: invert(100%); filter: invert(100%); } </style> That works fine, but once I click on the hamburger icon to see the menu listing, the hamburger itself becomes barely visible as it stays white, while the menu background also becomes white. I've attached screenshots of the before and after. The template is forte, Squarespace 7.0. Thanks in advance to anyone who can help! 🙂
  12. Site URL: https://www.questfinancialcoaching.com/ Can someone help me add a background to the hamburger menu? I'd like to add a background that covers both the hamburger menu + the word "MENU." Right now it just covers "MENU" Similar to this example - https://jana.showit.site/
  13. Hello! I'm using the Moksha template and have tried all of the CSS I can find with no change whatsoever. Has anyone changed the hamburger menu in this template.... on the left hand side to words or even just add the word MENU? Help please! Signed: Why can't my client just deal with the hamburger menu???
  14. Site URL: https://www.thecollective-academy.com/ Hi Hivemind, We are helping a client migrate from 7.0 to 7.1 while keeping as many of the same stylings as possible. The 7.0 template they are currently using is "Ready" (you will see functionality on the live site:https://www.thecollective-academy.com/) We are hoping to recreate the navigation style on their 7.1 site, but cannot find the right CSS to customize the changes. Would any one have any direction to share how we could possible accomplish this? Any help is appreciated!
  15. Site URL: https://pitto.squarespace.com/ Could you assist in reducing the size of the + hamburger symbol on mobile. Thank you.
  16. Site URL: https://www.robin-lyons.com/work/smirnoff Hello, I am trying to make my hamburger menu appear black on just the mobile page https://www.robin-lyons.com/work/smirnoff without effecting how the site header looks on the rest of the site. I have managed to make this black on my other mobile 'work' pages, for example https://www.robin-lyons.com/work/her-home-advantage using the code body#item-618d19fdcd79e33780a7b906 #header{background-color: #FFF !important;} body#item-618d19fdcd79e33780a7b906 #header a {color: #111 !important;} but for some reason this code doesn't seem to work on https://www.robin-lyons.com/work/smirnoff even if for example I use the code body#item-61533729f737a7012e2f7d80 #header{background-color: #FFF !important;} body#item-61533729f737a7012e2f7d80 #header a {color: #111 !important;} Any help would be most appreciated. Cheers, Robin.
  17. Site URL: https://www.bodyarch.com/ Hi, I'd love to replace my text navigation with a hamburger three line icon that displays on desktop (next to the social media icons, and Book Now). Can someone please share the CSS and what i would need to do to make my navigation titles connect to the hamburger icon? Thanks so much for your help!! Best, Louis
  18. Site URL: https://www.madorra.com Hi everyone, I'd like to know if there is custom css I can use to avoid the need to "double click" my dropdown "menu" folder on mobile to see the options - see screenshots for reference. On desktop I just have the "menu", when I hover over it you see the different areas of the page that you can smooth scroll to. On mobile, you need to click the hamburger icon, which THEN brings you to the "menu" overlay THEN you need to click into that to see the options. Anyway around this?
  19. Site URL: https://beyondspace-showcase.squarespace.com/custom-hamburger/?password=1234&utm_source=squarespace_forum&utm_medium=topic&utm_campaign=promo Hi my friends, I've been asking alot about applying fancy hamburger animation to Squarespace, so I tried to create a tool where the various animation can be fit well with Squarespace markup Access to this page for the step-by-step instruction to copy and paste the final code into your custom css, it will replace the current animation https://beyondspace-showcase.squarespace.com/custom-hamburger Note: This solution is specifically for applying custom animation, with options to change color of normal and active state, other term such as width or thickness will need to be implement manually videos.mp4
  20. 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/
  21. Site URL: https://blackbird-trout-b2n3.squarespace.com/ Hi, How would I move this hamburger over to the right next to the cart? password: password Currently have this code in CSS: .header-burger { display: flex; }
  22. Hello, How can I change the height of the hamburger menu and also turn off the animation of it turning into an 'X'? Thanks, R
  23. @tuanphan @creedon one last one if you can. Here is another website I am working on. http://smallballunited.com/home On mobile, when I click the hamburger icon, the cart PNG that I have is not hovering right. Anyway to fix this?
  24. I'm looking for code to make a few changes to my mobile hamburger and shopping cart: How do I make them smaller? Once they're smaller, how to I make sure they're still right aligned with margin of my mobile site? How do I add a stroke or make them a little bolder? How do I make the hamburger lines shorter? Bonus question! If I create my own shopping cart icon, how do I use that instead of squarespace's icon on both mobile and desktop? I've tried this code from another forum answer to make the burger smaller, and it didn't work: .burger-box { width: 15px; }
  • Create New...