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

Search the Community

Showing results for tags 'fixed-navigation'.

  • 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

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. Hi! Is there any way to fix the header and navigation bar always on top of the screen as I scroll down my main page? It is currently on top of my site and disappears as soon as I scroll down. I'm using Foster template and my site is: davidzamorano.tv Any suggestion would be appreciated. Thanks, David
  2. Site URL: https://amal-testsite.squarespace.com Hi all In Squarespace 7.1, there is already build in options to choice both “fixed position” and “transparent” in EDIT SITE HEADER. BUT, it doesn’t work. When header is fixed, then transparency doesn’t work. Instead Is has default or choosen background color. so how do I set or code to get transparent header/navigation menu when it’s also fixed? test site: https://amal-testsite.squarespace.com password is: abcabc
  3. Site URL: https://sheep-badger-7tzn.squarespace.com/ Hi all! I've seen a variety of questions on this topic but was unable to find one that was specific to my issue. I like having a fixed navigation header at the top of the site, but it is so large that when I scroll down it blocks a lot of my images. Is there a code that I can use to shrink the entire header as I scroll down so that it becomes much thinner? Thanks in advance!
  4. Site URL: https://www.cutnfill.com/ Hello, I am trying to test out a fixed site header on my website but I do not know the custom CSS or method of implementing one. Any thoughts?
  5. Site URL: https://www.cboothandson.co.uk/mens-grooming Hello, I was hoping someone could help me with this. I would like the category navigation bar to be visible to the customer as they scroll down the product page. There seems to be several solutions for making a 'sticky page header' but that isn't what I'm looking for. I only want the 'category navigation' to stick and the products to scroll behind it. Please see below for a screenshot highlighting exactly what part of the page I want to stick as the customer scrolls. Thank you in advance.
  6. Site URL: https://www.aditya-sinha.com/ Hi, I am looking to make the text on a blog page sticky, in order for it to stay on top of the page and serve as a sub-navigation for the blog posts below. I'm trying to achieve a similar Work page as is here: http://www.lauramccluskey.com/, with the categories/tags at the bottom of the page. Is there any method through Custom CSS and not Code Injection to possible achieve this? Password: tester
  7. Is there code specific to the Kent Template that can fix the header? Thank you for any help you can give me on this.
  8. Site URL: https://synthesizer-parakeet-hgtp.squarespace.com/config/pages/6087a48292661251f888ffc2 Hi! I'm struggling making the website as I designed it and I was wondering if someone could help me here. I'd like to move the social links from the header to the bottom left of the page. I'd like them to be vertical and with a line just beneath them. I did my best to move them trying both with CSS and adding a code in the homepage (you can see them both for now..). The main problems are: the vertical line disappears if I go to any other page + the social links move when I resize the page (I'd like them to stay still on the vertical line..the line doesn't move when I'm resizing the page). I'm working on a 7.1 version. The image shows how I'd like the homepage to be. I would really appreciate if anyone could help me with this. Thank you very much
  9. Site URL: https://www.hellosunshine-film.com/ I'm trying to use the code below to fix the header/navigation but it ends up moving the site title below the nav items. Please see attached before/after screenshots. THANKS! .Header { position: fixed!important; z-index: 1000; width: 100%; }
  10. Site URL: https://www.yaliglass.com I am refreshing our website (Brine 7.0) and would like to move our logo to the top centre position, with the main navigation underneath. As it takes up lots of space as a header I would like to be able to have the logo disappear when I scroll down and then fix the main navigation menu at the top of the page. I cannot figure out how to do this, I have tried various CSS but nothing has worked so far. Any help would be really appreciated! I attach two screen shots of what I would like it to look like (with Logo at top, then hidden when I start scrolling down to view the page content). Thanks! Ema
  11. Site URL: https://pickmeup2.squarespace.com/ Hello! I'm looking to move the position of the id navigation buttons down because they are being covered by my fixed announcement bar and navigation. Currently if you click on any of the navigation items they get covered. I'm looking to align each one right below the navigation as intended. Does anyone have a solution to fixing this? PASS WORD TO SITE : pickmeup
  12. Site URL: https://hibiscus-prism-cl9m.squarespace.com/ Hoping to get the footer fixed and transparent on all pages, as well as keeping its blocks horizontally stacked in the mobile version. Any help with any of the above is appreciated!!! Thank you :)
  13. Hello everyone. I am building 5 long pages that introduces 5 products. As visitors scroll down the long pages, they are kind lost of which product they are on. So is it possible to add text like" Product 1" and then set it fixed ,so that the "Product 1" title will follow as we scroll down the page? Thank you.
  14. Site URL: https://jasper-demo.squarespace.com/ I'm using the Jasper demo/ York template. Just curious if there is a work around to having the site header be fixed and have the whole header with a solid white bar background, while maintaining the left, right, top and bottom padding. Thanks in advance.
  15. I'd like to add a sticky sidebar with anchor link navigation to one of the pages on my site, exactly like the "Navigate This Post" sidebar on this site: https://thirtyeightvisuals.com/blog/free-squarespace-plugins-meet-ghost#mgfsp-anchor-08 What's the best way to go about adding this?
  16. Site URL: https://www.pagliaccifilm.com/bio Hello! I'm having problems with my active links in my fixed nav. It's not staying active on the page once it scrolls to the fixed page. Below is the code. (I bolded the line) PW for site: divodavid2021 .Header { position: fixed!important; z-index: 1000; width: 100%; } .Header-inner { padding-top: 50px; -webkit-transition: all .2s ease; -o-transition: all .2s ease; transition: all .2s ease; } .Header.scrollNav { background: #fff!important; padding-bottom: 10px; .Header-inner { padding-top: 10px!important; } .Header-branding { color: #000; } .Header-nav a { color: #000!important; &:hover { color: #db9271!important; } &:active { color: #db9271!important; } } } THANK YOU!
  17. Site URL: https://alison-mcgee.squarespace.com/ Hi! I've got a fixed header on my Brine 7.0 site. When using a mobile device flipped in a landscape position, it will do 1 of three things: List all the folder names in a row so that they're cut off. Fixed header doesn't work. Folder names stack, but fixed header doesn't work. Folder names stack and suddenly the fixed header works. So basically, sometimes it works and sometimes it doesn't. If I refresh my device then it is automatically fixed. How do I make it work all the time? For your reference, here's the code I added: .Header { position: fixed!important; z-index: 1000; width: 100%; } @media screen and (min-width: 640px) { .Index section:first-child:not(.Index-gallery), .Main--page, .Intro, .Main { padding-top: 81px; } .Intro + .Main { padding-top: 0px; } }
  18. Site URL: https://bluebird-porcupine-yzdg.squarespace.com/home-copy-1-1-1-1-1 Hello, I have created a menu navigation within my page and I wanted to make it 'stick' on screen so that when the user scrolls further down, it stays within sight. Is this possible? Page = https://bluebird-porcupine-yzdg.squarespace.com/home-copy-1-1-1-1-1 Pword = bluebird Many thanks, Best, Faiz
  19. Site URL: https://www.javieraguiar.com I'm currently using the fixed header with the "scroll back" option in Squarespace 7.1 and am hoping for some help with an issue I'm having: The "scroll back" header functions fine when scrolling through the pages on my site (top to bottom), but upon scrolling back to the top of the page, the header seems to have a slight glitch. After scrolling to the top from the bottom of the page, the header reappears, but in one quick motion it pushes the top-most section down slightly. Seeing this glitch motion each time I scroll to the top of my site is quite displeasing. Has anyone experienced this issue or have any potential solutions? Many thanks!
  20. Site URL: https://grape-primrose-9ww3.squarespace.com/ Hi, I am trying to change the appearance of the navigation menu as I scroll down the page. On scrolling past the header banner, I want the header background to remain transparent and the logo and navigation links to turn black. I have added some code already which was working before, but it seems like it has now stopped working for some reason...
  21. Site URL: http://www.courtney-crews.com/ Hi, Is there a way to have the navigation in mobile ishimoto to stay fixed at the top? So that when scrolling the menu is always accessible? I've tried this: /* Fixed Header - Mobile */ div#mobileMenuLink { position: fixed; left: 0; right: 0; z-index: 999; } However then the navigation covers the site title. Thanks
  22. Site URL: http://jcbouden.com Hey guys, I am new to squarespace and trying to find how to make it work. This might not be my last question 🙂 As a director, I want to make a landing page with a big video header so people have instantly an idea of my work. I also want to create a scroll down site, so I would like to have a fixed navigation bar at the top. The idea would be that this bar would be transparent at the top, so it won't hide the video, but then become black as soon as the viewers has left the video by scrolling down. An exemple here : http://www.shainblumphoto.com/ For now, I only entered header#header { position: fixed !important;} I am on 7.0 with hayden template. If someone has an answer it would be awesome ! Thanks guys
  23. Site URL: https://www.anqi-wu.com Hello! I am currently using the Wells template and really like the fixed sidebar navigation. However, for some reason the bottom part of my sidebar is cut off on the screen. The social link icons which are suppose to be at the bottom of the navigation aren't showing. Example below: The only way to get it to show is when I resize my Chrome browser to 80%. Example: Is there a custom css code available to auto resize my website so nothing is cut off, or to be able to just resize the sidebar navigation (20% smaller) so that I can get everything to show on screen. Thank you!
  24. Site URL: http://www.classiccthomes.com Hi, Thank you for any assistance. On my site I have a top level navigation. It's Projects-Elements-WhatWeDo-Etc On the Projects and Elements menu items I have other items so the template uses a drop down menu (not sure that is the correct term). The width of that drop down menu appears fixed. I would like for it (the width of the menu) to scale (width wise) based upon the width of the menu items contained within the dropdown. What I really want is for the text not to wrap so each menu item will appear on one line. So, for Projects, the items contained within the drop down menu Antique Farmhouse Shingle Manor Kitchen BumpOut Etc I do not want, say, Kitchen Bumpout, to wrap. Not sure how to begin so I am grateful for any help. -ClassicCTHomes
  25. Site URL: https://level7tx.com/home I'm wanting to change the navigation on scroll to a solid colored background. I have the navigation fixed at the top and want to keep it that way but to change the color of the background upon scrolling. The code I'm currently using is below. Any ideas on what code I need to use to change the color upon scroll? header#header { position: fixed; padding: 0; height: 140px; background-color: transparent !important; -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
×
×
  • Create New...