-
Posts
-
Hello, I have a Custom Design Upgrade, but I can’t figure out how to change the gingham header image with CSS. I have an image I want to replace the current gingham design with, but I don’t know how to replace what’s there with my new header image.
I’ve tried adding this CSS within Manage Themes > CSS, but it didn’t do anything:
#header {
background: url(‘http://i.imgur.com/sg2t9rW.png’) top center no-repeat;
height: 230px;
margin-bottom: -7px;
width: 100%;
}I’ve seen some people mention going into the stylesheet to see all the theme’s current CSS and edit it, but I don’t know how to find that. All I want to do is replace the header background image, how can I go about doing that?
The blog I need help with is sdkitchenista.com
Hi there. I suspect this may have something to do with hotlinking from imgur. To make sure that this is not an issue, first download the image here and upload it into your Media Library. Then use the link to your file (uploaded to your blog) in your CSS editor and let us know if that helps. If it doesn’t, we’ll try to sort out the proper CSS to use. Cheers.
Thank you, Philip! I tried what you said, but it didn’t seem to change anything. After uploading the image to my media library, the new CSS I used was:
#header {
background: url(‘http://sdkitchenista.files.wordpress.com/2013/06/kitchenista_header.png’) top center no-repeat;
height: 230px;
margin-bottom: -7px;
width: 100%;
}
Any other suggestions?
Hi there. So it turns out that #header isn’t really being used anywhere. Have you tried using the ID #masthead instead? What exactly are you trying to change? This seems to work well for me:
#masthead {
background: url('http://sdkitchenista.files.wordpress.com/2013/06/kitchenista_header.png') top center repeat-x;
width: 100%;
}
Ah, thank you so much! That worked! Thank you for all your help 8)
The topic ‘How to use CSS to change header’ is closed to new replies.
Theme Support 
