Jump to content

How to display a logo instead of the site title on one page of a site?

Recommended Posts

Site URL: https://www.rachelefron.com/songwriting-salon

Hello All, Working on a site that displays Site Title in the header on all pages. I want to display a logo instead on one page. I've seen many posts on how to display either the title or logo or both, but have not yet found a method to replace one with the other. I tried setting site title visibility to hidden, but inserting the logo via CSS makes the site title visible again.  Here's where I'm at:

<style>
.Header--top {background-color: #1985A1 !important;}
.Header-tagline {display: none;} 
  
.Header-branding, .Mobile-bar-branding {
   content: "";
   display: block;
   background-image: url(https://static1.squarespace.com/static/5d228e100f1dd60001f070a7/t/626572b55ffadb5f98bc58af/1650815669395/Songwriting+salon+temp+script.png);
   background-size: contain;
   width: 871px;
   height: 240px;
   margin-left: auto;
   margin-right: auto;
}
</style>

 

Thanks in advance for taking a look and any help!

Link to comment
  • Replies 1
  • Views 224
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

I see you able to add a logo.

To hide text, just add color: transparent;

.Header-branding, .Mobile-bar-branding {
   content: "";
   display: block;
   background-image: url(https://static1.squarespace.com/static/5d228e100f1dd60001f070a7/t/626572b55ffadb5f98bc58af/1650815669395/Songwriting+salon+temp+script.png);
   background-size: contain;
   width: 871px;
   height: 240px;
   margin-left: auto;
   margin-right: auto;
color: transparent !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.