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

Logo position in header on 7.1


Recommended Posts

Hi! I want my logo on the right side of my header and nav options on the left. I'm currently only given the option to have the logo on the right side or centered with various positions for navigation. I've checked to see what template I'm using and only see version 7.1 so I'm not sure if that is the issue or how I would be able to fix it. Please help!

Link to post
  • Replies 26
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Popular Posts

SS 7.1 supports Logo (center) - Navigation (left), doesnt support Logo (right) - navigation (left) You can set Logo (Center) - Nav (left), then add this code to Home > Design > Custom CSS

Use this code @media screen and (max-width:991px) { .header-display { flex-direction: row-reverse; } .header .header-title-nav-wrapper .header-title { text-align: right; } }  

Posted Images

  • 2 weeks later...

Hi! This worked great for me too but the logo is still positioned on the left/hamburger on right in mobile. How can I swap these so the logo remains on the right in small screen sizes?

 

Thanks!

Link to post
7 hours ago, mandabuck said:

Hi! This worked great for me too but the logo is still positioned on the left/hamburger on right in mobile. How can I swap these so the logo remains on the right in small screen sizes?

 

Thanks!

Can you share link to your site?

You can send your question to my email to get faster answer. / How to Setup Password & Share URL 

-- I'm Tuan, work for a non-profit project (build free libraries). I check the forum once or twice a day to help out the community. If you don't see me answering your question, you can send it to the email above. 

Link to post
1 minute ago, CW2 said:

Hi @tuanphan

On SS 7.1. CROSBY template

I would like to have Logo (center) - Navigation (right), is that possible? 

 

Can you share link to Crosby template demo?

You can send your question to my email to get faster answer. / How to Setup Password & Share URL 

-- I'm Tuan, work for a non-profit project (build free libraries). I check the forum once or twice a day to help out the community. If you don't see me answering your question, you can send it to the email above. 

Link to post
17 minutes ago, CW2 said:

Hi @tuanphan

On SS 7.1. CROSBY template

I would like to have Logo (center) - Navigation (right), is that possible? 

 

I think it is possible. I will test again tomorrow. SS 7.1 loading slowly tonight

You can send your question to my email to get faster answer. / How to Setup Password & Share URL 

-- I'm Tuan, work for a non-profit project (build free libraries). I check the forum once or twice a day to help out the community. If you don't see me answering your question, you can send it to the email above. 

Link to post
5 minutes ago, tuanphan said:

I think it is possible. I will test again tomorrow. SS 7.1 loading slowly tonight

Ok thank you! 

Link to post
8 hours ago, mandabuck said:

Yes, thank you! The site is https://prospect-studio.squarespace.com/ pw: wilson. 

Would like the logo to remain right-aligned in small screens. It works on desktop but not small screens right now. 

Add to Home > Design > Custom CSS

.header-menu-nav-folder-content * {
    text-align: right !important;
}

 

You can send your question to my email to get faster answer. / How to Setup Password & Share URL 

-- I'm Tuan, work for a non-profit project (build free libraries). I check the forum once or twice a day to help out the community. If you don't see me answering your question, you can send it to the email above. 

Link to post
12 hours ago, mandabuck said:

Hi @tuanphan Thanks, but that is not what I meant! 🙂 Please see attached showing what it looks like currently, and what I am trying to achieve. I did this in Photoshop.  

 

 

Use this code

@media screen and (max-width:991px) {
.header-display {
    flex-direction: row-reverse;
}
.header .header-title-nav-wrapper .header-title {
    text-align: right;
}
}

 

You can send your question to my email to get faster answer. / How to Setup Password & Share URL 

-- I'm Tuan, work for a non-profit project (build free libraries). I check the forum once or twice a day to help out the community. If you don't see me answering your question, you can send it to the email above. 

Link to post
  • 2 months later...
On 3/29/2020 at 1:09 AM, tuanphan said:

SS 7.1 supports Logo (center) - Navigation (left), doesnt support Logo (right) - navigation (left)

You can set Logo (Center) - Nav (left), then add this code to Home > Design > Custom CSS


@media screen and (min-width:768px) {
.header-title-nav-wrapper {
    flex: 1 0 100%;
}
.header-layout-branding-center .header-title {
    text-align: right;
}
}

 

Thanks for a great workaround!

Any chance you can group "elements" (language and social buttons) with the logo on the right side, with the logo being last on the right?
With the current code, those elements will be moved to a lower line offset from the middle.

Link to post
5 hours ago, camarx said:

Thanks for a great workaround!

Any chance you can group "elements" (language and social buttons) with the logo on the right side, with the logo being last on the right?
With the current code, those elements will be moved to a lower line offset from the middle.

Can you share link to your site? I can check easier.

You can send your question to my email to get faster answer. / How to Setup Password & Share URL 

-- I'm Tuan, work for a non-profit project (build free libraries). I check the forum once or twice a day to help out the community. If you don't see me answering your question, you can send it to the email above. 

Link to post
22 hours ago, Jefte said:

TuanPhan,

Can't get my logo on mobile to get to the center. Any ideas? Used the codes above.

https://nomadcannabis.squarespace.com/config/design

1234

Also, anyway to make the header transparent so that the logo lives on the image directly below it?

Add to Home > Design > Custom CSS

@media screen and (max-width:767px) {
.header-title {
    text-align: center !important;
}
}

 

You can send your question to my email to get faster answer. / How to Setup Password & Share URL 

-- I'm Tuan, work for a non-profit project (build free libraries). I check the forum once or twice a day to help out the community. If you don't see me answering your question, you can send it to the email above. 

Link to post
  • 2 months later...
On 9/18/2020 at 6:59 PM, Cheryljacklyn said:

Hi @tuanphan How do I get my logo header to stay in the center with my navigation links on the right?

Can you share site url? We can check easier.

You can send your question to my email to get faster answer. / How to Setup Password & Share URL 

-- I'm Tuan, work for a non-profit project (build free libraries). I check the forum once or twice a day to help out the community. If you don't see me answering your question, you can send it to the email above. 

Link to post

@tuanphan The site isn't launched yet but here's a screenshot of the homepage.  I'm on 7.1 and currently using the header style where the logo image is in the middle and the navigation links are on the left. However, I'd like to have all the navigation links to live on the right side. 

 

403906838_ScreenShot2020-09-21at3_30_50PM.thumb.png.225fa306b2a173819a5fe431afe3b732.png

Link to post
On 9/21/2020 at 8:32 PM, Cheryljacklyn said:

@tuanphan The site isn't launched yet but here's a screenshot of the homepage.  I'm on 7.1 and currently using the header style where the logo image is in the middle and the navigation links are on the left. However, I'd like to have all the navigation links to live on the right side. 

 

You can setup password & share url

You can send your question to my email to get faster answer. / How to Setup Password & Share URL 

-- I'm Tuan, work for a non-profit project (build free libraries). I check the forum once or twice a day to help out the community. If you don't see me answering your question, you can send it to the email above. 

Link to post

Create an account or sign in to comment

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


×
×
  • Create New...