Jump to content

Display different logo on product detail page

Recommended Posts

Site URL: https://www.houseofkimane.com/


I'm trying to display a different logo ONLY on the product detail pages. 

Right now I have a custom white logo on the main page and store, there it looks really good because of the image in the background. But in the product detail pages the logo gets completely lost because it's a white logo over white color (page background color without image).

I tried with this code on STORE SETTINGS/ADVANCED, but it changes the logo in both the store and the product detail page, and I would like to change it only in the product detail one

<style>.header-title-logo img {
    visibility: hidden;
.header-title-logo a {
    background-image: url(https://static1.squarespace.com/static/5f25a68ab4a57a02b8e4c8f8/t/5f310ce6649257471c73f09a/1597050086928/houseofkimane-header-logo-black.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
      height: 42px;

Thank you so much for your help 🙂


Link to comment
  • Replies 3
  • Views 516
  • Created
  • Last Reply
  • 2 months later...
On 12/15/2020 at 10:44 PM, MB12 said:

is there a reason (@RWP) that this doesn't work for the montauk template?

Above code for Squarespace 7.1 template.

Montauk is 7.0, you need to use this code

  .logo-image .logo img {
    filter: invert(1);
    -webkit-filter: invert(1);


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


This topic is now archived and is closed to further replies.

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