artbysambass Posted August 19, 2021 Share Posted August 19, 2021 (edited) Site URL: http://www.artbysambass.com/ Hello, I'm trying to create a single page on my site that has a different colored background, text, and logo than the rest of my site. I tried putting some code into the advanced section of the site and was able to change the background color and one of the test lines but that's it. PAGE Has anyone tried this or know how to do this? I'm using the Avenue template for my site and I'm in version 7 of the interface. Thanks, Sam Edited August 20, 2021 by artbysambass added more information for clarity Link to comment
tuanphan Posted August 21, 2021 Share Posted August 21, 2021 On 8/20/2021 at 12:20 AM, artbysambass said: Site URL: http://www.artbysambass.com/ Hello, I'm trying to create a single page on my site that has a different colored background, text, and logo than the rest of my site. I tried putting some code into the advanced section of the site and was able to change the background color and one of the test lines but that's it. PAGE Has anyone tried this or know how to do this? I'm using the Avenue template for my site and I'm in version 7 of the interface. Thanks, Sam Hi. It looks like you solved this? 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
artbysambass Posted August 22, 2021 Author Share Posted August 22, 2021 No this is as far as I got. I can't figure out how to make the logo a different image on just this page and all of the type white so that it shows up. I attached a screen shot of what I'm talking about. Link to comment
tuanphan Posted August 23, 2021 Share Posted August 23, 2021 11 hours ago, artbysambass said: No this is as far as I got. I can't figure out how to make the logo a different image on just this page and all of the type white so that it shows up. I attached a screen shot of what I'm talking about. Add to Design >Custom CSS /* Coming soon page */ body#collection-611e8ee21c7c884383608ac6 .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
artbysambass Posted August 31, 2021 Author Share Posted August 31, 2021 (edited) Thanks for the suggestion @tuanphan but that didn't change anything on the page. What I'm looking for isn't a global change to all of the design, I need it to be changed on an individual page which is why I tried using code in the advanced section on that specific page. Edited August 31, 2021 by artbysambass spelling Link to comment
tuanphan Posted August 31, 2021 Share Posted August 31, 2021 2 hours ago, artbysambass said: Thanks for the suggestion @tuanphan but that didn't change anything on the page. What I'm looking for isn't a global change to all of the design, I need it to be changed on an individual page which is why I tried using code in the advanced section on that specific page. That code targets coming soon only & work on custom CSS only. If you add to Advanced Section, it won't work 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
artbysambass Posted September 1, 2021 Author Share Posted September 1, 2021 I added it to the Custom CSS in the Design tab. There it didn't have any effect. Link to comment
hilaryb Posted September 1, 2021 Share Posted September 1, 2021 I have a similar question - how to use a different logo image for one page only. When I use different color themes on other pages, it effects the visibility of my main logo (see attached screenshots). Is there a way to change the logo on one page to an image I have uploaded to my custom files? http://hilarybeckwith.com/services Link to comment
tuanphan Posted September 1, 2021 Share Posted September 1, 2021 3 hours ago, artbysambass said: I added it to the Custom CSS in the Design tab. There it didn't have any effect. Try adding a Code Block under Gallery Block >> Then add this code > Then save & reload your site <style> .logo-image .logo img { filter: invert(1); -webkit-filter: invert(1); } </style> 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
tuanphan Posted September 1, 2021 Share Posted September 1, 2021 7 minutes ago, hilaryb said: I have a similar question - how to use a different logo image for one page only. When I use different color themes on other pages, it effects the visibility of my main logo (see attached screenshots). Is there a way to change the logo on one page to an image I have uploaded to my custom files? http://hilarybeckwith.com/services Change image to black, or different image? If black, add this to Design > Custom CSS /* - Change Services Page Logo Color to black */ body#collection-60f8600ef406692e8c57e335 .header-title-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
hilaryb Posted September 1, 2021 Share Posted September 1, 2021 4 minutes ago, tuanphan said: Change image to black, or different image? If black, add this to Design > Custom CSS /* - Change Services Page Logo Color to black */ body#collection-60f8600ef406692e8c57e335 .header-title-logo img { filter: invert(1); -webkit-filter: invert(1); } Different image. Black does not coincide with my branding colors Link to comment
tuanphan Posted September 4, 2021 Share Posted September 4, 2021 On 9/2/2021 at 5:30 AM, hilaryb said: Different image. Black does not coincide with my branding colors Add to Design > Custom CSS /* Change logo on services page */ body#collection-60f8600ef406692e8c57e335 { .header-title-logo img { visibility: hidden; } .header-title-logo a { background-image: url(https://cdn.pixabay.com/photo/2021/08/25/20/42/field-6574455__340.jpg); background-position: center center; }} 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
hilaryb Posted September 6, 2021 Share Posted September 6, 2021 On 9/4/2021 at 12:17 AM, tuanphan said: Add to Design > Custom CSS /* Change logo on services page */ body#collection-60f8600ef406692e8c57e335 { .header-title-logo img { visibility: hidden; } .header-title-logo a { background-image: url(https://cdn.pixabay.com/photo/2021/08/25/20/42/field-6574455__340.jpg); background-position: center center; }} Thank you - how do I now resize it? Link to comment
tuanphan Posted September 8, 2021 Share Posted September 8, 2021 On 9/7/2021 at 1:12 AM, hilaryb said: Thank you - how do I now resize it? Use background-size /* Change logo on services page */ body#collection-60f8600ef406692e8c57e335 { .header-title-logo img { visibility: hidden; } .header-title-logo a { background-image: url(https://cdn.pixabay.com/photo/2021/08/25/20/42/field-6574455__340.jpg); background-position: center center; background-size: 100px; }} 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
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment