Jump to content

MOVE SOME NAVIGATION LINKS TO RIGHT SIDE IN HEADER

Recommended Posts

Posted (edited)

Hi all,

This seems like it should be so easy to do, but I haven't been able to see how it's possible (which is slightly mind-boggling). 

I'd like to keep the logo in the center of the header but move the "Contact" and "Appointments" navigation link to the right side of the site header. 

https://www.embodiedlivingwithmarc.com
Password: marco

Any help you can provide would be very appreciated.  Thank you!

Best,
Marc 

Edited by MarcAdam
Posted

It's not a native option, so it's not easy to do, luckily there are lovely people who have figured this out and share their code, this is one of many options:

 

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!

📈 SEO Space (Referral link)
Ⓜ️ 
Will Myers' Plugins & Tutorials (Referral link)
 🔌 Ghost Squarespace Plugins (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲SQSP Themes (Referral link) 
Spark Plugin (Referral link) 
 🖼️Pinch-to-Zoom Gallery Lightbox Plugin (Referral link) 

 Did I help? Buy me a coffee?

Posted

I have a button and a menu dropdown in my navigation. Is it possible to switch the location of the button to be first, and then the dropdown menu to be in the last space? Image below: basically have them swap places. Thankyou!

Screenshot 2024-04-14 at 9.47.05 AM.png

Posted
On 4/14/2024 at 11:49 PM, breakwater said:

I have a button and a menu dropdown in my navigation. Is it possible to switch the location of the button to be first, and then the dropdown menu to be in the last space? Image below: basically have them swap places. Thankyou!

Screenshot 2024-04-14 at 9.47.05 AM.png

Hi, We can use some CSS flex to change order of these items. If you share site url, we can help 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!)

  • 1 month later...
Posted (edited)

hey @tuanphan I am in need of the same as this post, I followed your guide and am having just some issues with the right hand side of my menu, I'd like the "CART" button to be farthest child right and I'd like all the right hand menu items to be justified far right with no padding, same as left. Also would like them to be evenly spaced in between items, like left. For some reason not able to figure it out!

 

Attaching a screenshot and here's my website:

https://magnolia-hibiscus-g8lg.squarespace.com/

Password: standout

 

May you assist? thank you!!

Screenshot 2024-06-12 at 11.07.33 AM.png

Edited by Lelle56
Posted
On 6/13/2024 at 1:11 AM, Lelle56 said:

hey @tuanphan I am in need of the same as this post, I followed your guide and am having just some issues with the right hand side of my menu, I'd like the "CART" button to be farthest child right and I'd like all the right hand menu items to be justified far right with no padding, same as left. Also would like them to be evenly spaced in between items, like left. For some reason not able to figure it out!

 

Attaching a screenshot and here's my website:

https://magnolia-hibiscus-g8lg.squarespace.com/

Password: standout

 

May you assist? thank you!!

Screenshot 2024-06-12 at 11.07.33 AM.png

You can use this code to Custom CSS box

/* Fix cart */
  .header-actions.header-actions--right {
    flex-direction: row-reverse !important;
    justify-content: flex-start !important;
}
.header-actions.header-actions--right nav>div:last-child {
    margin-right: 0 !important;
}

 

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!)

  • 5 months later...
Posted

Thanks so much for the guide! I tried it but have two issues:

1. I would like the third menu item, Collaborations, to stay on the left hand side

2. I would like the two social icons to move furthest right, after the two menu items Personal work and Contact

Can you please help?Screenshot2024-11-25at21_32_58.thumb.png.7eb9a0be17c30ba27127ba5176ae8a3b.png

Posted
On 11/26/2024 at 4:34 AM, Hattol said:

Thanks so much for the guide! I tried it but have two issues:

1. I would like the third menu item, Collaborations, to stay on the left hand side

2. I would like the two social icons to move furthest right, after the two menu items Personal work and Contact

Can you please help?Screenshot2024-11-25at21_32_58.thumb.png.7eb9a0be17c30ba27127ba5176ae8a3b.png

Do you have site url?

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!)

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.