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

Search the Community

Showing results for tags 'hamburger'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • 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
  • 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

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


About Me


Website


Location


Badges


Expert ID

  1. I need some help with getting a simple CSS code that adds a divider/separator between my 4.th and 5.th menu page. I have a total of 8 pages on the hamburger menu and need to separate half of them from the other half. I have squarespace 7.1. This modification would only apply to the mobile version of the site.
  2. Hi there looking to create a menu similar to the one on the left here https://www.uncommon.london/ with the about, contact, who. however we want these hidden in a burger menu and only revealed when the user hovers over them. They don't need to click through to any pages just reveal the info when hovered over. Would this require CSS ? Thanks
  3. Hi, I've used custom CSS (below) to force the hamburger nav to appear on desktop. Is there a way to customize the font size and spacing on desktop without altering it on mobile? .header-burger { display:flex!important} .header--menu-open .header-menu {opacity: 1!important;visibility: visible!important;} .header-nav, .header-actions {visibility:hidden!important} Thanks!
  4. Site URL: https://swan-arugula-5f75.squarespace.com/ Site password: 12345678 Template: Carson Currently my site shows both the social media buttons and the navigation bar. My home page already has the main navigation as an index page. I want to continue showing my social media buttons but make my main navigation a hamburger menu only on the home page. Is there any way to do this? So in the screenshot attached, basically make "Home", "About", "Divisions", and "Contact" and hamburger, and always show the social media buttons. Thanks so much in advance!
  5. 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/
  6. Site URL: https://www.acnetkleen.com Hi, My website is acting wonky and is showing the "Hamberger menu (mobile) " on desktop. Sometimes when you play with the window width the normal menu comes back. It should look like the attached screenshot. (Note: There are no options in the Theme back-end to adjust mobile) The website is: https://www.acnetkleen.com Theme is: Bryant I need to reduce the breakpoint OR remove the "Hamberger menu" on desktop completely (or both!) I've tried various codes from other posts/forums on here but nothing works as I think the theme I am working with is too old. Any help would be much appreciated! Thank you and best health
  7. Site URL: http://katiecaftravel.com Hi all, when my site is on tablet/phone size the nav bar compresses to a hamburger icon that needs to be clicked to open - problem is it's only working on half the pages! SQ SP help doesn't want to help because I have custom code on my site - I have a custom code side bar I bought from SQ SP Themes https://www.sqspthemes.com/plugins/sidebar-plugin That I thought could be the problem but pages where I have the side bar still have the hamburger working - it seems like a random issue. like it's not working on this page https://www.katiecaftravel.com/indonesia but it's working on this page https://www.katiecaftravel.com/travel-diaries _________________________________________________________________________________ EDIT: The problem is 100% the SQSP THEMES sidebar. I took two identical pages and removed the sidebar from the head code on one and it fixed the issue. Without sidebar: https://www.katiecaftravel.com/indonesia with sidebar: https://www.katiecaftravel.com/mexico So... I mean what to do now? I bought this sidebar for $60 because it was made especially for Squarespace, but it's disabling my hamburger nav on all the pages I put it on (except blog pages, randomly) - Squarespace can't help because it's a custom code issue. Anyone know any quick fixes for this? this is the code I inject into the header: <!-- Plugin Sidebar --> <link href="/s/plugin-sidebar.css" rel="stylesheet"> <script src="/s/plugin-sidebar.js"></script> <script>pluginSidebar({"url":"sidebar","allowedPages":"*"});</script> <!-- end Plugin Sidebar -->
  8. So I want to basically put my hamburger menu in the middle of my page in a block instead of in the header I really can't work out how to do it, I have spent hours searching. I basically want the option of clicking the hamburger after my main content that opens up the overlay page. is there a way to maybe put it in the footer? then I can hide the header on the main page Cheers!
  9. So I have worked out how to force the hamburger but now I am trying to work out how to place the hamburger (which is actually a + sign for me) under the heading title. As you can see I have tried to play around with the different header layouts and it just moves them further right every one I click. I should add if i turn off the forced hamburger/mobile on all devices options the navigation is in the center under the title Thanks in advanced!
  10. Site URL: https://scarlet-grape-g5ln.squarespace.com I'm trying to get my hamburger menu operate properly on mobile. Two issues about it are that it's pulling up "The Burger >" instead of the direct menu and the second issue is the transparency, I can't seem to get it to be white and not transparent.
  11. Hi, Anyone know how to turn the nav on the desktop version into a hamburger? I want mine in the top right corner.
  12. is it possible as you scroll down a page to have the nav shrink into a hamburger menu? so 3 lines would be at the top if you are midway/somewhere down the page? and have that hamburger menu pop open on the side or something?
  13. My mobile menu has a really long scroll for no reason? but it only scrolls away the header and the X at the top while the middle links and button sit still. How do I just get rid of the scroll on the mobile menu only so its just a single page? site : https://flugelhorn-seahorse-lzrb.squarespace.com/?p?p pw: design
  14. Site URL: https://www.sabustudio.com Hi, I have set up my navigation for desktop, it is all working as I want on desktop, although I am having issues with it on mobile device. On desktop I have integrate this code so the folders redirect to specific pages: <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <script> $('.header-nav-folder-title[href="/furniture-folder"]').click(function() { window.location = "https://sabustudio.com/furniture"; }); $('.header-nav-folder-title[href="/object-folder"]').click(function() { window.location = "https://sabustudio.com/object"; }); $('.header-nav-folder-title[href="/lighting-folder"]').click(function() { window.location = "https://sabustudio.com/lighting"; }); Although, on mobile the folder navigation does not utilise the redirect link as it does on desktop, it just links to the folder contents. It currently goes as follows: I would like it to go: I am trying to remove/bypass the second hamburger menu page and instead wanting to use the redirect link. This enables better user experience for my product. I'm not sure if its possible to do this, but I imagine there would be a way to do this. Any help would be much appreciated! Thanks
  15. Site URL: https://www.brunhilda.cz/ Hi, I would like to know if there is any code to change WELLS mobile navigation hamburger menu, so it does not cover the full page. so from this: to this (or something similar :): Thanks so much for your advice!
  16. Site URL: https://www.htcreative.co.uk Hiya, i'm trying to right-align the hamburger icon on the mobile display of my site, so that it sits top right of screen but on the same line as my logo. Can anyone help with some code for this? Thanks!
  17. Site URL: https://taranaomi.squarespace.com Hi Everyone! I'm wondering if someone could help me out with changing my navigation typeface to a custom typeface. I was able to change to a custom typeface for my h1, h2, h3, p etc. but for some reason can't change my links within the hamburger navigation itself. So far I have this; @font-face { font-family: 'Voyager-Regular'; src: url(https://static1.squarespace.com/static/6015f371cbc71f649dab977e/t/6052b16db706164bacfb8e7a/1616032109736/Voyage-Regular.otf) } h1 { font-family: 'Voyager-Regular';} h2 { font-family: 'Voyager-Regular';} h3 { font-family: 'Voyager-Regular';} h4 { font-family: 'Voyager-Regular';} p { font-family: 'Voyager-Regular';} .header-nav { display: none; } .header-burger { display: flex; } .header--menu-open .header-menu { opacity: 1; visibility: visible; } I've attached screenshots so you can see what I'm referring to. Headings work great on my other pages, it's just the links within the hamburger menu that won't change for both mobile and desktop.
  18. I'd like to have the page links showing instead of hiding it in the hamburger menu on mobile. Is there a way to do so? I tried using a custom CSS that I found on another forum post but it didn't work. I'm also using the Cole template if that helps anyone Here's a picture of something that I would want to see in a mobile view! Thank you!
  19. Site URL: https://kaygriffin.com I have a hamburger menu visible on both desktop & mobile. Everything works as expected. However, a brief flash of color occurs on the Nav header after closing out of the Menu Overlay and I can't find the cause. I don't want it to do that. Any idea how to fix?
  20. Site URL: https://sheep-tetra-sgjg.squarespace.com/paintings-drawings Hi, When previewing my site on mobile, it looks like the hamburger icon is just slightly too far to the left of the screen, making it off-centered. Is there a way to make it centered on every mobile device? Thanks!
  21. Site URL: http://www.goedland.nl Hi all! I'm looking for a way to hide the mobile hambuger menu on a few specific pages of my website.. How do I best do this? In my Custom CSS I've added the following code on the pages I needed to hide the main navigation & footer. In this I have succeeded, but the hamburger on mobile remains... Also is there an easier way to hide the main nav and footer than what I've used now? Thanks in advance! #collection-5ea43d4d14bd4f0e74ba7e12 .Header-nav { display: none!important; } #collection-5ea43d4d14bd4f0e74ba7e12 .Footer { display: none!important; } #collection-5ea442813c53f87600534627 .Header-nav { display: none!important; } #collection-5ea442813c53f87600534627 .Footer { display: none!important; } #collection-5ea442b5f222897b8d590132 .Header-nav { display: none!important; } #collection-5ea442b5f222897b8d590132 .Footer { display: none!important; } #collection-5ea442c7a9fa910a7d7f11b2 .Header-nav { display: none!important; } #collection-5ea442c7a9fa910a7d7f11b2 .Footer { display: none!important; } #collection-5ea442c28315084d6dba2579 .Header-nav { display: none!important; } #collection-5ea442c28315084d6dba2579 .Footer { display: none!important; } #collection-5ea442cebe3c470ba754c787 .Header-nav { display: none!important; } #collection-5ea442cebe3c470ba754c787 .Footer { display: none!important; } #collection-5ea442bbb1653635c3af81f4 .Header-nav { display: none!important; } #collection-5ea442bbb1653635c3af81f4 .Footer { display: none!important; } #collection-5ea442af1d0fc8570b270cfe .Header-nav { display: none!important; } #collection-5ea442af1d0fc8570b270cfe .Footer { display: none!important; } #collection-5ea44341397d8072ce4662c6 .Header-nav { display: none!important; } #collection-5ea44341397d8072ce4662c6 .Footer { display: none!important; } #collection-5ea443362fec9937a4430f10 .Header-nav { display: none!important; } #collection-5ea443362fec9937a4430f10 .Footer { display: none!important; } #collection-5ea4433b00047c5743af480b .Header-nav { display: none!important; } #collection-5ea4433b00047c5743af480b .Footer { display: none!important; } #collection-5ea44325ee86164fffff2b3e .Header-nav { display: none!important; } #collection-5ea44325ee86164fffff2b3e .Footer { display: none!important; } #collection-5ea4432b397d8072ce466142 .Header-nav { display: none!important; } #collection-5ea4432b397d8072ce466142 .Footer { display: none!important; } #collection-5ea4433089503f2e48088ef6 .Header-nav { display: none!important; } #collection-5ea4433089503f2e48088ef6 .Footer { display: none!important; } #collection-5ea443878315084d6dba3c03 .Header-nav { display: none!important; } #collection-5ea443878315084d6dba3c03 .Footer { display: none!important; } #collection-5ea4437de702471b5a2a30f4 .Header-nav { display: none!important; } #collection-5ea4437de702471b5a2a30f4 .Footer { display: none!important; } #collection-5ea442a78315084d6dba22b4 .Header-nav { display: none!important; } #collection-5ea442a78315084d6dba22b4 .Footer { display: none!important; }
  22. Site URL: https://heron-snail-244c.squarespace.com/ Hi all! Ive set my desktop view to collapse into a burger menu when the screen is smaller than 1050px. It works fine unless I scroll at all, in which case the drop down menu is no longer visible when I click the burger. This only happens on desktop, its fine on mobile. Can someone please help? Below is the custom CSS Im using. TIA! Link is: https://heron-snail-244c.squarespace.com/ (not yet published) PW is: N3w$ton3 @media screen and (max-width:1050px) { .header-nav, .header-actions { display: none!important;} .header-burger { display: flex!important;} .header--menu-open .header-menu {opacity: 1; visibility: visible; width:50%} .header-menu .header-menu-nav a {font-size:1.25rem; padding: 0rem} }
  23. Site URL: https://www.joannestonedesign.com/ Hi, I need some help. I added a hamburger menu in my desktop version. I wanted to know if there is a possibility of removing that white / gray bar that appears in the menu. Also I changed the default cart of squarapace for the word CART but it does not appear in the mobile version. Does anyone know how I can solve that? pls help. thank you very much, InΓ©s
  24. Site URL: https://www.ultimategearlists.com/ I am using Squarespace 7.0, with the Five template. The link to my site is: https://www.ultimategearlists.com/. My desktop navigation menu has grown, and now has too many elements to fit in a single line when viewing on a narrower desktop or a tablet. I would therefore like to use an arbitrary breakpoint (say around ~1200px) below which the navigation bar changes to a right-aligned hamburger icon and clicking on the hamburger icon will produce a drop down navigation similar to mobile. Unfortunately the breakpoint for switching from desktop navigation to mobile navigation (i.e. hamburger) appears hardcoded in the Five template, at 640px. So I likely need to use custom CSS to get around that. I have tried various custom CSS approaches based on other forum posts, but none seem to work. Perhaps since they aren't suitable to the Five template. Any assistance would be much appreciated!
  25. Site URL: https://keyboard-jaguar-k52z.squarespace.com/ Hi there, I'd like to split the overlay menu into 2 columns, something like the image attached. This is the website I'm working on: https://keyboard-jaguar-k52z.squarespace.com/ Password: tpt-2021 Any suggestions? πŸ™‚ Thanks!
Γ—
Γ—
  • Create New...