header image replacement - why is this so hard?
Permalink
So I've read many threads in these forums related to this, but it's still unclear to me what I need to do. I have this simple site built on the default Plain Yogurt theme:
http://www.jodeurbrouck.com/
I want to replace the site name "Jo Deurbrouck" with an uploaded image that spans the width of the page. As you can see, as of now I've inserted a test image in the block below the site name, but that's not what I want. I know I can prevent the site name from showing up by deleting the text that appears in the site name field of the system & settings section in the dashboard, but that also deletes the site name from the copyright statement in the footer, which is undesirable, and also leaves extra placeholder space above the image that I'd rather not be there..
This should not be this difficult. I've seen many different threads in this forum proposing various methods to accomplish this. I know it is theme dependent, and the solution generally involves changing some lines of code in either the header.php or main.css files. It also seems the preferred method changed with the update the c5 v. 5.5 (something about the fact there used to be a global scrapbook, but now it's gone and things are handled differently).
Come on folks, there should be a simple set of instructions or tutorial on how to do this, perhaps provided with each theme that comes with some placeholder image, since just about everyone will want to do it.
Please help, thanks.
http://www.jodeurbrouck.com/
I want to replace the site name "Jo Deurbrouck" with an uploaded image that spans the width of the page. As you can see, as of now I've inserted a test image in the block below the site name, but that's not what I want. I know I can prevent the site name from showing up by deleting the text that appears in the site name field of the system & settings section in the dashboard, but that also deletes the site name from the copyright statement in the footer, which is undesirable, and also leaves extra placeholder space above the image that I'd rather not be there..
This should not be this difficult. I've seen many different threads in this forum proposing various methods to accomplish this. I know it is theme dependent, and the solution generally involves changing some lines of code in either the header.php or main.css files. It also seems the preferred method changed with the update the c5 v. 5.5 (something about the fact there used to be a global scrapbook, but now it's gone and things are handled differently).
Come on folks, there should be a simple set of instructions or tutorial on how to do this, perhaps provided with each theme that comes with some placeholder image, since just about everyone will want to do it.
Please help, thanks.
#page {
margin: auto;
text-align: left;
width: 800px;
}
Change the width to what you want and slap your image in.
That's the width for the entire page so set it a little larger say 960 or 940. As for having the full width header it takes a bit more work, and you would have to insert values for everything within, like the nav, and the like as its tied to overall width, so your probably better off looking for a free or paid theme that has the full screen header function your looking for, rather than spending the time to modify yogurt.
If you dont know where to find .css files go to your cpanel, and open file manager in your host cpanel not c5. This would be in the same place you would find simplescripts for example.
In file manager open the path to your theme for example public_html/concrete/themes/greekyogurt/...........
and than edit the main.css within
Also keep in mind that changing the overall width does not auto change areas so you will want to set your main area and sidebar areas to an increased width as well.
You should also look into grabbing filezilla, and should watch this video on editing csshttp://www.youtube.com/watch?v=3KdNRZS-uSg...
It takes a few minutes to get to the editing, but worth watching as it will explain how to use a dev console to help you figure out where, and what to edit