Hi
I cannot figure out how to customize background of elements that appear between header and footer.
I want to use linear gradient with few steps of colors. The first and the last one will also be the color of header and footer (I want the header and the footer to be using uniform colors - without transitions).
Unfortunatelly .site and .x-site affects also the header and footer. I cannot identify the class of the element that I should customize using css.
Could You please help?
Hi @Autostopowicz,
Thanks for writing in.
I am not sure which part of the site that you want to adjust. I know where the header and footer is however It would be best that you will share us your URL and a screenshot so that it would be easy to suggest which CSS that you are trying to use and to prevent a very long thread for a simple inquiry
Thank you so much.
Hi Nico
Url and password in the secure note.
Hi There,
Click Edit Page, on Wp Classic backend editor, under the blue update button > Page Attributes > Page Templates select Blank No Container Header Footer
After that you can add the CSS
.x-main.full {
background: linear-gradient(to bottom, #f8b195, #f67280, #c06c84, #6c5b7b, #355c7d) !Important;
}
Alternatively, you can keep as you have it and remove the background color of your navbar and footer by using :
.x-navbar, .x-colophon.bottom {
background: none !important;
}
Hope it helps!
Hi
The first solution works perfect - thanks!
One more question:
The container from Page Attributes > Page Templates is not the same container from Cornerstone > Section > Row > Column Container, right?
Hi there,
No it isn’t. The page templates are the template used for the template itself and the Column Container option in Cornerstone will set the width of the section if it will be full screen or will be inside a container,
Hope this helps.
Hi,
Thanks for the info. Everything I wanted to know in this topic, for now, is clear for me. Thanks again guys.
You’re most welcome!