Forums

Header question in elemental

Permalink
How do I add a header image that spans the full width of a page like the header and footer of the elemental theme.
I have seen this with other themes I have bought but was curious if possible in elemental theme.
I have an image that I will put on top of the background color. The edges of the image will match the background color and give this section the ability to scale to different screen sizes but still go edge to edge.
 
MrKDilkington replied on at Permalink Best Answer Reply
MrKDilkington
Hi jireland,

You can set a background image for the header using Custom CSS.
Toolbar > Page Settings (gear icon) > Design > Theme > Customize > Custom CSS gear icon button

Here is an example of the CSS you would use:
div.ccm-page header {
    background: url(http://your_site/.../your_image.jpg) no-repeat center center;
}

To get the image URL, go to the file manager and upload your file. After uploading, click on the image and select "Properties" from the menu, in the popup modal copy the image link from the "URL to File" line.
osirisprime replied on at Permalink Reply
Thank you !