Background image for entire header

[KimAnn]

Hello,

Is there a way to have an image cover the entire header? So on this site:

Home

I want the entire blue background of the header to show an image instead.

Please advise and thank you,

Kim

[Prasant]

Hello Kim,

Thanks for asking.

You can add following CSS under X > Theme Options > CSS:

.x-logobar {
    background-image: url("Image-URL-Here");
}

.x-navbar {
    background-image: url("Image-URL-Here");
}

In page of Image-URL-Here please add the URL of the image.

1- I have found the proper CSS code selector using the Chrome browser Developer Toolbar: https://www.youtube.com/watch?v=wcFnnxfA70g

2- For the CSS code itself, I suggest that you get started with this tutorial: https://www.youtube.com/watch?v=yfoY53QXEnI

Thanks.

[lisacole1]

@Prasant

.x-logobar {
background-image: url(“Image-URL-Here”);
}

.x-navbar {
background-image: url(“Image-URL-Here”);
}

Hi, I have tried this on http://baggator.org.uk/ but it isn’t working for me

[jade]

Hi Lisa,

The issue seems to be caused by the file name of the image file you are trying to use:

http://baggator.org.uk/wp-content/uploads/2011/10/CvhHh-bWcAACej2.jpg_large.jpeg

Please rename the file and make sure there is just one period in the file name that is before the file extension.

Hope this helps.