Changing header and footer color on one page only

Hey everyone! I need help with my css code injection. I want to change the color of my header and footer on certain webpages, but when I tried to used other codes posted on this forum, they didn't work for me. Not sure if its something in my code that's blocking the change. Also, please let me know if there is anything I can do to make my codes better.

the password is: madameafwik

Thank you!

Hi,

What is site url?

Hey! It's https://www.alaysiasbijoux.com/

To change Header/Footer Background Color on One Page, add this code into Page Header (DO NOT add code to Custom CSS)

<style>
  header#header .header-background-solid, footer.sections section, footer.sections .section-background {
    background-color: #f1f !important;
}
</style>

Thank you so much that worked! Is it possible to change the text in the header in footer on one page with css as well? 

@tuanphan

Use this

<style>
  header#header .header-background-solid, footer.sections section, footer.sections .section-background {
    background-color: #f1f !important;
}
  header#header * {
  	color: black !important;
  }
  footer.sections * {
  	color: #f1f !important;
  }
</style>

I'd like to do this (change header color and link color) without using code injection but instead by using the collection ID. (Because my client doesn't want to pay for more than the personal plan)

Can you help?

I can't seem to get it quite right. https://www.katienave.com/

(here's the page I want to change: https://www.katienave.com/voiceover

Thanks in advance

On 12/20/2023 at 7:39 AM, cherylr said:

I'd like to do this (change header color and link color) without using code injection but instead by using the collection ID. (Because my client doesn't want to pay for more than the personal plan)

Can you help?

I can't seem to get it quite right. https://www.katienave.com/

(here's the page I want to change: https://www.katienave.com/voiceover

Thanks in advance

You can use Code Block instead, just edit page > Add a Code Block (anywhere on page) > Then paste the code

Personal Plan still supports Code Block