Jump to content

Clarkson Template: Center Navigation Bar and Logo

Recommended Posts

The Clarkson template is Squarespace 7.1, you don't need any code, just to change the desktop header layout in the header settings.

https://support.squarespace.com/hc/en-us/articles/360000667707-Building-a-site-header

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
Hire me on Upwork!

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

Link to comment

Hi Ziggy, thanks for your quick response.

I used the navigation settings and it is all centered now, except the social media links, which appear to the left. Ideally, the should appear next to the last navigation item (in this case, "CONTACT US"). Please see screenshot attached. 

Thanks!

Screenshot 2023-04-13 at 8.44.31 AM.png

Edited by AnaimationDesign
Link to comment

Can you add and share a site wide password and the website URL so I can provide you with some code that should help with this?

https://support.squarespace.com/hc/en-us/articles/205815528-Site-wide-passwords

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
Hire me on Upwork!

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

Link to comment

Try this for size, it doesn't do exactly what you want, but I couldn't immediately see a way to have the navigation and social elements next to each other.

.header-display-desktop {
  flex-direction: column-reverse;
}
.header-layout-branding-center-nav-center .header-title-nav-wrapper {
  flex: 0 0 100    margin-left: 0;
  margin-left: 0;
}
.header-layout-branding-center-nav-center .header-actions--left {
    flex: 0 1 100%;
    max-width: 100%;
    margin-top: 2vw;
}

An alternative may be to add the social icons to the navigation via links, this guide should help:
https://christyprice.com/blog/how-to-add-social-media-icons-to-squarespace-navigation

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
Hire me on Upwork!

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

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.