Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].
Is there a way to change the header and footer colors for each page individually?
Hi André
Thanks for reaching out.
Unfortunately not from within theme options. You could however use Appearance > Custom CSS for this. For example, on the home page you might insert into Custom CSS:
/* Home */ .home header#masthead { background: #fcfcfc; } .home #colophon { background: #2f3033; }Take a quick look at our Custom CSS tutorial: https://siteorigin.com/basics/modifying-theme-design-with-custom-css/. In there Greg covers using your browsers developer tool. On each page in the source code you’ll find a body tag. Each page has a unique class, for example the home class I used above. In this way you could adjust colors on a page by page basis.
Hi André Bowen
You can fix/change this with some custom CSS but you will need some information from the page first.
Navigate to the page you want to change the colours on and press f12 to open the developer console of your browser.
Look for the body tag in the page code. In there you should find an entry for the page ID.
Then if you navigate to Appearance > Custom CSS, you’ll get our custom CSS editor. Just add the following code.
.page-id-2 #masthead, .page-id-2 #colophon { background: #000; }You can change the colour code to any colour hex value
http://www.w3schools.com/tags/ref_colorpicker.asp
If you want them to be different colours then you would use this instead
.page-id-2 #masthead { background: #000; } .page-id-2 #colophon { background: #CCC; }Let us know how you get on
Magus
I’ll give this a try thanks a ton for your help!