ryanscv Posted June 4, 2022 Share Posted June 4, 2022 Hello! Is there a way to have the heading logo change based on the dynamic background for the page? It seems silly that there is a dynamic header design option without the ability to implement at least a light and dark logo version. Thanks for the help! CraigN 1 Link to comment
tuanphan Posted June 10, 2022 Share Posted June 10, 2022 You can add custom code on each page to do this. If you still need help, please share link to your site 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
CraigN Posted September 5, 2022 Share Posted September 5, 2022 Bumping this for the same issue. Dynamic header is a great feature except it only applies to text and buttons. It would be great to be able to upload dark and light logo options to update dynamically too! I also have the added dilemma of wanting to use the gradient behind the nav on the homepage (as I'm using a video background), and then dynamic on all other pages.https://cod-hibiscus-mlx3.squarespace.com pass: justlove ✦✦Co-founder Hundred Studio 👋 Link to comment
tuanphan Posted September 6, 2022 Share Posted September 6, 2022 16 hours ago, CraigN said: Bumping this for the same issue. Dynamic header is a great feature except it only applies to text and buttons. It would be great to be able to upload dark and light logo options to update dynamically too! I also have the added dilemma of wanting to use the gradient behind the nav on the homepage (as I'm using a video background), and then dynamic on all other pages.https://cod-hibiscus-mlx3.squarespace.com pass: justlove You found the solution or you need help? 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
CraigN Posted September 6, 2022 Share Posted September 6, 2022 6 hours ago, tuanphan said: You found the solution or you need help? I still need help please, the homepage and about page work because they have dark headers (I uploaded a white logo). But on the events page this then gets lost, where ideally it would show a dark version of the logo. ✦✦Co-founder Hundred Studio 👋 Link to comment
tuanphan Posted September 7, 2022 Share Posted September 7, 2022 22 hours ago, CraigN said: I still need help please, the homepage and about page work because they have dark headers (I uploaded a white logo). But on the events page this then gets lost, where ideally it would show a dark version of the logo. Try adding to Design > Custom CSS body[class*="type-blog"], [class*="type-events"], [class*="type-products"] { header#header img { filter: invert(1); -webkit-filter: invert(1); } } CraigN 1 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
CraigN Posted September 8, 2022 Share Posted September 8, 2022 This works, brilliant thank you @tuanphan! ✦✦Co-founder Hundred Studio 👋 Link to comment
hellgateindustries Posted October 5, 2022 Share Posted October 5, 2022 Holy Cow. ive been looking for the solution to this, and here it is in 3 seconds. thank you! Link to comment
JeSuis Posted November 16, 2022 Share Posted November 16, 2022 Is there any chance of being able to change the dark colour, to a grey and not a solid black? I've been wanting this solution for ages and that code works a treat, but would just love if i could change to a grey colour. Thanks! Link to comment
tuanphan Posted November 20, 2022 Share Posted November 20, 2022 On 11/16/2022 at 11:31 PM, JeSuis said: Is there any chance of being able to change the dark colour, to a grey and not a solid black? I've been wanting this solution for ages and that code works a treat, but would just love if i could change to a grey colour. Thanks! Hi,No The code can change to white or black only To change to grey, you need to use this new code, with new grey image url body[class*="type-blog"], [class*="type-events"], [class*="type-products"] { header#header img { content: url(https://cdn.pixabay.com/photo/2022/10/21/10/51/snail-7536762_1280.jpg); } } Replace Pixabay image with a grey image url 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
simon Posted January 24 Share Posted January 24 For a simple inverting of the header logo color site wide, this works. Place in your Custom CSS: //Invert header logo color on dark themed Sections .dark, .dark-bold, .black, .black-bold { &.header .header-title-logo a { filter: invert(1); -webkit-filter: invert(1); }} Thanks to https://spacesites.com.au/tips/squarespace-71-2-methods-to-swap-out-logos-colour-sections-and-specific-pages for the tip and cheat sheet on theme colors. Alternatively, you could switch out the logo graphic as described in the spacesite.com link above. 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