Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Display different logo on product detail page



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 🙂


Edited by houseofkimane
Link to post
  • Answers 3
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

On the pages your want the darker logo, go to the page code injection and add, no need for a different image. <style> .header-title-logo { filter: invert(1); } </style>  

3 answers to this question

Recommended Posts

  • 0
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);


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment

  • Create New...