Support » Installing WordPress » Changing the Header Image

  • In the Theme Editor, the Header Template has a bit of info that reads………

    “/* To ease the insertion of a personal header image, I have done it in such a way,
    that you simply drop in an image called ‘personalheader.jpg’ into your /images/
    directory. Dimensions should be at least 760px x 200px. Anything above that will
    get cropped off of the image. */

    I did exatly that but the image never changed. Is there another step that is not mentioned here? Thanks for the advice.

Viewing 11 replies - 1 through 11 (of 11 total)
  • There is a new article in the WordPress Codex on this called Designing Headers which will give you the information you need.

    Here are some other tips.

    * Make sure that you fully refresh your browser to see the changes.

    * Make sure you put the image file in the right folder.

    * Check the spelling of the file you saved, just in case.

    Thank you!

    I assume that means you found the solution. Good for you.

    Folks I am throwing myself at your mercy…..

    – I have on my computer in a file on my desktop a GIF image I made that I want to use as the header on my site.
    – I made it the same size as the default header on my current WP site (
    – I uploaded it through Filezilla to my remote site
    – It is residing at (/…named personalheader.jpg

    The ‘Changing the header image’ section of the codex sez
    “ To change only the header image reference, open the header..php template file and look for…..

    #header {
    background: url (“<?php bloginfo ( ‘ stylesheet_directory) ?>/ images / kubrickheader.jpg”) no-repeat bottom center; }
    …..and “ to change the image file, replace “kubrickheader.jpg” with the name of the new graphic image you have uploaded to your site to replace it.

    When I replace kubrickheader.jpg with the graphic file named personalheader.jpg….and edit, no change takes place on my site though the editor sez it was successful.

    What am I not doing?

    — the graphic image is 740×192 pixels
    — I tried replacing stylesheet_directory with the url of the graphic file ((/……….no go
    — I changed the image to a jpg file and re-uploaded it… go
    — I refreshed the browser and checked the site… go

    Question: is (/ ) the correct place to upload the image on my remote site? Is this where WP looks for it?

    Question: Is this what the change should look like on the header.php page?

    #header { background: url(“<?php bloginfo(‘/stylesheet_directory’); ?>/images/personalheader.jpg”) no-repeat bottom center; }

    I have to admit I’m feeling a little stupid about this.
    looking for some guidance for a Newby

    Could you be seeing the old cache?

    It sounds like you did everything right…

    Thanks for the reply. So I went back and realized I uploaded the image into the WP admin/images file at my remote host… wrong place to send it I guess.

    So I sent it to the WP content folder…..then to themes….then to default….then to images

    This brought it up on my site, but now the letters from the old header are showing through the new header.
    Do I need to remove something I didn’t?
    site is

    In my theme I find the call to that text at the end of my header.php file. (wp-content/themes/themename/header.php)

    You can try commenting it out like this:
    <!-- <h1 id="title"><a href="<?php echo get_settings('home'); ?>/" title="<?php bloginfo('name'); ?>"><?php bloginfo('name'); ?></a></h1>
    <p id="description"><?php bloginfo('description'); ?>

    (Add <!-- before and --> after…)

    When you open up header.php you will probably also see that there is a set of embedded styles in that file like this section: –

    body { background: url(“”); }
    #page { background: url(“”) repeat-y top; border: none; }
    #header { background: url(“”) no-repeat bottom center; }
    #footer { background: url(“”) no-repeat bottom; border: none;}

    Check that section because it is still throwing up the old blue header image which is behind the white header you designed. The code created is

    Thanks for the suggestions folks. Just so’s ya know I’ve never done anything with code before. But, I’ll take a look at it.
    stikNstein will try anything


    Good luck. Don’t forget to keep a backup of the header.php just in case.

    And thanks google_earth, I missed that old image there…

    Thanks a ton guys. I had to comment two lines of code out

    <div id=”header”>
    <div id=”headerimg”>
    <!– <h1>/”><?php bloginfo(‘name’); ?></h1> –>
    <!–<div class=”description”><?php bloginfo(‘description’); ?></div> –>

    one for the main title(name), and one for the (description.)

    Worked perfect


Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘Changing the Header Image’ is closed to new replies.