Jump to content

Fixed navigation, floating logo. How?

Recommended Posts

Site URL: https://yarzatwins.com

Hello All!

I am looking to create a header effect similar to that of the amazing Yarza Twins. This site was profiled on squarespace's  site an won me over. https://yarzatwins.com

Any idea how to make a fixed navigation bar and scrollable logo?

Bonus points if you can tell me how they modified the navigation text styles too. Really like the highlighted active page, as opposed to SS's standard underline.

Version 7.1 please!

Thanks in advance to this awesome group.

Link to comment
On 12/2/2021 at 11:53 PM, seriouslytim said:

Hi Tuanphan!

Thank you for your reply. It's still a work in progress, but my site can be found at: saintim.com

It looks like you figured it out? Or you want to keep logo sticky only, remove nav on scroll?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
On 12/5/2021 at 10:59 PM, seriouslytim said:

Unfortunately, it didn't figure it out. Totally stuck over here 😶

The goal is to treat the logo and navigation separately. The navigation bar will stay fixed at the top and the logo will scroll with page content. Check out this site as an example of the outcome I'd like to achieve: https://yarzatwins.com

Do you use Personal or Business Plan?

If Personal Plan, you can enable fixed header, then we will give the code to remove navigation/icon on scroll, keep logo scroll only.

If Business plan, let me know, we will give some script code to achieve this, it will be better than above way.

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
8 hours ago, tuanphan said:

Do you use Personal or Business Plan?

If Personal Plan, you can enable fixed header, then we will give the code to remove navigation/icon on scroll, keep logo scroll only.

If Business plan, let me know, we will give some script code to achieve this, it will be better than above way.

You are amazing! I'm using a business plan 👍

Link to comment
  • 10 months later...
  • 8 months later...

Has Anyone found a solution to this? 

I'm on 7.1 and have forced the mobile nav to appear on desktop and would like the hamburger menu to stay stationary, but the logo to scroll (and reappear on scroll-back). So I guess like this but opposite - so instead of floating logo, and fixed navigation - I would like fixed logo and floating nav. 

Any help would be greatly appreciated! 

Edited by L_Avec
Link to comment
On 7/6/2023 at 8:55 AM, L_Avec said:

Has Anyone found a solution to this? 

I'm on 7.1 and have forced the mobile nav to appear on desktop and would like the hamburger menu to stay stationary, but the logo to scroll (and reappear on scroll-back). So I guess like this but opposite - so instead of floating logo, and fixed navigation - I would like fixed logo and floating nav. 

Any help would be greatly appreciated! 

What is site url? We can check easier

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

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