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 comment
  • 2 weeks later...
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?

Email me if you have need any help (free, of course.). Answer within 24 hours.

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
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?

Email me if you have need any help (free, of course.). Answer within 24 hours.

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

Email me if you have need any help (free, of course.). Answer within 24 hours.

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, 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;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

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
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;
}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

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

Email me if you have need any help (free, of course.). Answer within 24 hours.

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
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;
}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

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

Email me if you have need any help (free, of course.). Answer within 24 hours.

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

Email me if you have need any help (free, of course.). Answer within 24 hours.

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