Assigning themes to the footer section for separate pages

Site URL: https://megalodon-ocelot-kzmp.squarespace.com/

I would like to assign a colour theme to the footer for each individual page so that it can match the colour scheme of the content above it.

Could someone please advise if this is possible!

https://megalodon-ocelot-kzmp.squarespace.com/

Password is: HV123

Thanks

Hi. You mean change footer background?

Hi tuanphan. Yes that's correct but hoping to get it to match a certain colour theme. Guessing it might not be possible to do that and will need custom css for each section?

Basically want to have the footer match the colour of the content page.

Thanks,

10 hours ago, Billy1996 said:

Hi tuanphan. Yes that's correct but hoping to get it to match a certain colour theme. Guessing it might not be possible to do that and will need custom css for each section?

Basically want to have the footer match the colour of the content page.

Thanks,

Add this to Page Header (Hover on page on Main Navigation or Not Linked > Click Gear Icon to open Page Header)

<style>
  footer.sections .section-background {
    background-color: red !important;
}
</style>

Hey, just tried creating a code for the footer, but it didn't work:

.footer.sections:hover>a { 
  color: turquoise !important;
  section-background: none !important;
}

I would like to change the color of the Footer Sections when hovering over them, just like in the Navigation menu:

www.soulmaidjewelry.com

On 5/3/2021 at 7:07 AM, Juelz said:

Hey, just tried creating a code for the footer, but it didn't work:

 

 

.footer.sections:hover>a { 
  color: turquoise !important;
  section-background: none !important;
}

 

 

I would like to change the color of the Footer Sections when hovering over them, just like in the Navigation menu:

 

www.soulmaidjewelry.com

Add to Design > Custom CSS

/* change footer background on hover */
footer.sections:hover .section-background {
    background-color: green;
}

That changed the whole footer green.
Is there a way to only change the font color of the respective link/section (shipping & returns, privacy policy) to change color when hovering?

On 5/5/2021 at 6:38 AM, Juelz said:

That changed the whole footer green.
Is there a way to only change the font color of the respective link/section (shipping & returns, privacy policy) to change color when hovering?

 

 

You mean

• Hover footer >> change all links color
• OR Hover link >> change link color?
• or..?

2 hours ago, tuanphan said:

OR Hover link >> change link color?

Yess, --> hover link, change link color. 

20 hours ago, Juelz said:

 

Yess, --> hover link, change link color. 

Add to Design > Custom CSS

/* footer links hover color */
div#page-section-601382aeb6e0da670d3aaf59 a:hover {
    color: red;
}

20 hours ago, tuanphan said:

/* footer links hover color */ div#page-section-601382aeb6e0da670d3aaf59 a:hover { color: red; }

Awesome, I appeciate it!