Jump to content

Make site title logo image larger on Squarespace 7.0 (Pacific family, Horizon)

Go to solution Solved by Ziggy,

Recommended Posts

Can you share your website URL?

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 adding this to Custom CSS:

#logoImage img {
    width: 500px;
    max-width: 500px;
}
#header #logoWrapper, #header #logoImage {
    width: 500px;
}

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

You should be able to adjust that bigger on mobile in the header -> Logo settings, but if that doesn't get it big enough then you can use this Custom CSS:

@media only screen and (max-width: 767px) {
  #header #logoWrapper #logoImage img, #header #siteTitleWrapper #logoImage img {
    max-height: 100px !important;
  }
}

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
Just now, Trickpix said:

Thank you very much @Ziggy! Just saved me a lot of time!

Happy to help. Thanks for marking my post as the solution, if you can give it a like too that's always appreciated!

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

On the last piece of code change the max-width value from 767px to 900px.

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
  • 9 months later...

Hi, I could use some help. I'm having the same problem, but this code didn't work.

url is thebakergrp.com

#logoImage img {
    width: 880px;
    max-width: 880px;
}
#header #logoWrapper, #header #logoImage {
    width: 880px;
}
Link to comment
Just now, pantano3 said:

Hi, I could use some help. I'm having the same problem, but this code didn't work.

url is thebakergrp.com

#logoImage img {
    width: 880px;
    max-width: 880px;
}
#header #logoWrapper, #header #logoImage {
    width: 880px;
}

I used to have this code in there which was great, but it has stopped working

.Header-branding-logo {

    max-width: 880px;

}

.Mobile-bar-branding-logo {

  width: 23%;

}

Link to comment
On 6/20/2024 at 9:59 PM, pantano3 said:

I used to have this code in there which was great, but it has stopped working

.Header-branding-logo {

    max-width: 880px;

}

.Mobile-bar-branding-logo {

  width: 23%;

}

I see you solved with this code?

.Header-branding-logo {
    max-width: 85%;
    width: 55vw !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!)

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.