Change header image size with CSS – Twenty Ten

  • Resolved rachelshoots

    (@rachelshoots)


    13 years, 5 months ago

    Hi,

    I want to use an image that isn’t 198 by 940 (the default size for Tenty-Ten header images). I’ve seen a lot of posts recommending that the user change the functions.php file. I have 3 specific questions:

    1) I can’t find the functions.php file. Where is it?
    2) My site is hosted by WordPress itself. I read that WordPress does not allow custom themes on sites it hosts itself. Is that why I can’t find functions.php?
    3) Is it possible to change the header image size via the CSS stylesheet? How? I tried this code and it didn’t work:

    #headerimg {
    height:100px;
    width:940px;
    margin:7px 9px 0;
    }

    Thanks,
    Rachel

Viewing 3 replies - 1 through 3 (of 3 total)
  • Michael

    (@alchymyth)

    13 years, 5 months ago

    1)
    functions.php is in the theme folder, side-by-side with index.php, single.php, style.css, and all the others

    to edit it, go to the ‘dashboard – appearance – editor’ then selct it from the list on the right

    2)
    that explains why you can’t find the functions.php – as a customer of wordpress.com, you have limited access to files.

    so forget 1) as you can’t edit anything else than style.css.

    for more support see
    http://en.forums.wordpress.com/

    3)
    as the themes at wordpress.com can be quite different from ‘free’ themes, the best is to ask at the wordpress.com support forum http://en.forums.wordpress.com/forum/support

    Thread Starter rachelshoots

    (@rachelshoots)

    13 years, 5 months ago

    Thanks. I’d suspected #2 was what was going on, but couldn’t find it anywhere. Argh! Who thought changing the size of my header would be so hard?

    Luke Gedeon

    (@lgedeon)

    13 years, 4 months ago

    Rachel,

    Since you are really just wanting a smaller image you do have another option. Upload a 940×198 image where the top half is what you want and the bottom half is (white/transparent/doesn’t really matter). Then use CSS similar to this:

    #branding {
    height:150px;
    overflow:hidden;
    }

    I am not sure about the height because the branding box includes the site-title and the image. Might have to experiment a bit. But you will definitely want to adjust “#branding” instead of “#branding img” because will just flatten the image.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Change header image size with CSS – Twenty Ten’ is closed to new replies.