Guest Posted February 2 Share Posted February 2 (edited) Hey all, I need your assistance with CSS. I've successfully made code to add a custom logo that I've uploaded to custom files, the problem is the main site logo I want to replace (on this page only) is still visible. How can I hide the main site-wide logo on one page, but keep the new one I've added? The page I want to do this on is /photo The photo page should have the dark logo. The main logo is light. Code I used to successfully add new logo: #collection-63d1a5abb1fbe8770971fe49 { .header-title-logo img { background-image: url(https://static1.squarespace.com/static/5f8f8579bd28b521edb70235/t/63db65ded0085b54d15159f7/1675322846377/thelandofdustin_logo_photo_dark.png); } } It's important that I can achieve this with CSS as I can't add page specific code via code injection. Personal plan is what I have. www.dustin.land/photoSite password is: SQtemp123 Your help is always appreciated! Thank you! 😊 Edited February 2 by DustinWilliam Link to comment
Ziggy Posted February 2 Share Posted February 2 The easiest way is to use CSS to invert your logo, which might not work given your logo colour, but it's an option: #collection-63d1a5abb1fbe8770971fe49 { .header-title-logo img { filter: invert(1); } } This code to swap the logo is different to yours and worth a try: #collection-63d1a5abb1fbe8770971fe49 { #logo { background-image: url('https://static1.squarespace.com/static/5f8f8579bd28b521edb70235/t/63db65ded0085b54d15159f7/1675322846377/thelandofdustin_logo_photo_dark.png'); } } Let me know if either solution works! Please like and upvote if my comments were helpful to you. Cheers! Zygmunt Spray Squarespace Website Designer Contact me: https://squarefortytwo.com 🔌 Ghost Squarespace Plugins (Referral link)📈 SEO Space (Referral link)⬛ SquareWebsites Plugins (Referral link)☕ Did I help? Buy me a coffee? Link to comment
Guest Posted February 2 Share Posted February 2 The code to swap does not work. using #logo doesn't work. It just hides all logos. Link to comment
Solution tuanphan Posted February 8 Solution Share Posted February 8 On 2/3/2023 at 3:19 AM, DustinWilliam said: The code to swap does not work. using #logo doesn't work. It just hides all logos. Replace this code #collection-63d1a5abb1fbe8770971fe49 .header-title-logo img { background-image: url(https://static1.squarespace.com/static/5f8f8579bd28b521edb70235/t/63db65ded0085b54d15159f7/1675322846377/thelandofdustin_logo_photo_dark.png) } with this #collection-63d1a5abb1fbe8770971fe49 .header-title-logo img { content: url(https://static1.squarespace.com/static/5f8f8579bd28b521edb70235/t/63db65ded0085b54d15159f7/1675322846377/thelandofdustin_logo_photo_dark.png) } 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
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment