Squarespace Logo Tips

Some tips for Logo on Squarespace 7.1 websites.

How to Add Logo

To add logo, login to your site

Hover on Right Side > Click Edit

Hover on Header > Click Edit Site Header

Header Layout box will appear. Click Site Title & Logo

and upload logo

How to Remove/Hide Logo

Entire Site

Add this code to Home > Design > Custom CSS to remove Logo on Entire Site

.header-title-logo img {
    display: none;
}

One Page

if you want to hide or remove logo on One Page, add this code to Page Settings > Advanced > Header

<style>
.header-title-logo img {
    display: none;
}
</style>

How to Make Logo Bigger

If logo too small, you can add this code to Home > Design > Custom CSS to make logo bigger.

Adjust 200px to any number what you like.

.header-title-logo img {
    max-height: 200px;
}

Change Mobile Logo Size

Add this code to Home > Design > Custom CSS

@media screen and (max-width:767px) {
.header-title-logo img { 
  max-height: 200px; 
}
}

Change Logo Color

If you want to change Logo Color on One Page, add this code to Page Settings > Advanced > Header

<style>
.header-title-logo img {
    filter: invert(1);
}
</style>

How to Center Logo

Edit Site Header, click Header Layout

Choose Layout has Logo Center

Then Done > Save.

Share this post:

2 thoughts on “Squarespace Logo Tips”

Leave a Comment