How to add a different site logo to a specific page - Squarespace 7.1

There might be an occasion where you want to add a different site logo to an individual page. Well, here’s the code that can make it work.

Instructions:

• Upload your image to Custom CSS (Website -> Website Tools -> Custom CSS)

• Select “Custom Files” and upload the image here

• Then click on that URL, which will display it within the Custom CSS area.

• “Cut” that URL

• Go to the specific page in question

  • Settings (This is the cog icon)

    • Advanced

Then paste in the below and replace the following URL “https://static1.squarespace.com/static/“ with your own URL that has been made via the uploaded file.

<style> 
div.header-title-logo a {
content:url("https://static1.squarespace.com/static/") !important;     
max-width: 300px;
}
</style>

---

Using a specific Mobile Logo as well?

If you are also using the “Mobile Logo” as well, then you can use the code below to override the default.

Note: You don’t need to use this if you’ve only used the main ‘logo’ into the site.

<!-- Mobile Only Logo -->
<style> 
  div.header-mobile-logo img {
content:url("https://static1.squarespace.com/static") !important;     
max-width: 300px;
}
  
</style>