How to make header dynamic on homepage, but solid on the others

I'm currently working on a site where I want the homepage to have a full bleed slideshow on the whole page, but for the rest of the pages I want the header to be solid (that is, to be it's own section with white background)

I've managed to make the homepage how I want it to be, but the problem is that I can't figure out how to make the other pages in a different way.

Site: https://caterpillar-parrotfish-m9mk.squarespace.com/ (password: AFLA)

The CSS I used to make the slideshow appear below the header was this:

// SLIDESHOW GALLERY BEHIND HEADER NAV //
.page-section.gallery-section{padding-top:0px!important;}
 

Any ideas?

Hm, it seems like I can't inert code specifically for the home page in the code injection section? Which means that if I inject your code for the header, it will affect all pages as well. Might this be because I'm still on the trial version?

 

To add custom code in particular page follow these setps:

> click the gear icon next to page as shown in screenshot

> click on Advanced tab under "Page settings"

33 minutes ago, DangDang said:

Hm, it seems like I can't inert code specifically for the home page in the code injection section? Which means that if I inject your code for the header, it will affect all pages as well. Might this be because I'm still on the trial version?

Go to page settings, and advanced.

That worked! Thank you very much, looks great. 

22 minutes ago, DangDang said:

That worked! Thank you very much, looks great. 

Nice one!