Jump to content

Invert logo on multiple pages

Recommended Posts

Site URL: https://violin-pepper-ljt7.squarespace.com/

Basically the same question as this forum post, I have a white logo that looks good on the home page with a full bleed image, but the rest of my site is white, so it disappears. 


I would like to either a) find out how to add onto that custom CSS in the previous answer to target pages other than the homepage, so I can just invert the colors on the pages that need it, or b) add a background to the header on other pages that don't have full-bleed images as their first block.



Update: I've found a sort of workaround solution, by injecting the CSS into the header of each page that needs the inverted logo. Though I'm open to hearing a better way to go about this!

Link to comment
  • Replies 1
  • Created
  • Last Reply

Target with this class (Home > Design > Custom CSS)

body:not(.homepage) css class/id name {
	filter: invert(1);

This will target all pages, exclude Homepage.

your site is private so I can't give exactly code.

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

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.