Transparent Homepage Header

Hi,

How can i make the product page header opaque before and after mouse scroll down?
All pages have opaque header except the homepage and product page.
In THEME SETTINGS > HEADER > APPEARANCE > HEADER BACKGROUNG i can change that but is for both pages, how can i maintain homepage like it is with transparent header and opaque in the product page? And why all other pages are also opaque?
Image attached.

Thanks,
SR

Attachments:

You must be logged in to view attached files.

Hello,

Please add this code to the Theme Settings > Custom CSS > Global:

body .main-header.act-scroll {
    background-color: red;
}
body .topbar-wrapp {
    background-color: red;
}

Then find this code and change:

body .main-header.header-has-no-bg.color-scheme-light.act-scroll {
    background-color: transparent;
}

replace the color with “transparent”

Best Regards

[Author]

Posts