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

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

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

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

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...
On 10/13/2022 at 7:44 AM, nahlah said:

any updates on a code where the navigation bar sticks and only the logo scrolls?

What is your site url?

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

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

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.