How to Add an Alternative Logo to One Page in Squarespace
Sometimes, you want your logo to be unique to a particular page—whether it’s a blog, portfolio, or landing page. The good news is that it’s totally doable in Squarespace with a few quick steps. In this tutorial, I’ll show you exactly how to add an alternative logo to a single page on your site.
Table of Contents
Watch the Video
Check out the YouTube video below 👇
Step 1: Upload Your Logo
First, make sure you have your alternate logo file ready—whether it’s a PNG or JPEG. You’ll need to upload this to the Custom CSS panel. Here’s how:
Go to Website → Pages → Website Tools → Custom CSS.
Once you're in the CSS panel, upload your logo under Custom Files.
Copy the URL of the file; we’ll need it in just a second!
Step 2: Insert the Code
Next, we’re going to add a little custom code. Head to the page where you want the alternate logo to appear:
Navigate to the page settings, click Advanced, and open the Page Header Code Injection.
Paste the following code snippet:
<style>
.header-title-logo img {
visibility: hidden;
}
.header-title-logo a {
background-image: url(YOUR_LOGO_URL);
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
width: 200px!important;
}
</style>Make sure you replace 'YOUR_LOGO_URL' with the URL of the logo you uploaded earlier.
Step 3: Adjust the Size
Want to tweak the size of your new logo? Easy! Inside the code snippet, you’ll see width: 200px;. Feel free to adjust this number to make the logo larger or smaller.
Conclusion
And there you have it! Now you’ve got a custom logo displayed on just the pages you want. If you’re looking for more ways to customize your Squarespace site, feel free to reach out. I’m always here to help with tips, tricks, and solutions to make your site work smarter, not harder.
Full Code
<style>
.header-title-logo img {
visibility: hidden;
}
.header-title-logo a {
background-image: url(YOUR_LOGO_URL);
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
width: 200px!important;
}
</style>
Hey hey, Marya here 👋🏼
I’m the creative force behind Yangu Web Studio and a top-rated web designer on Squarespace's exclusive Marketplace for experts.
I adapt my skills to diverse industries and businesses globally, of all sizes, specializing in crafting digital solutions tailored to your unique goals. If you want to discuss a potential project, you can drop me a line at marya@yanguweb.studio or vibe with me here. Alternatively, you can schedule a free 15-minute consultation call here.
