WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Change header image size with CSS - Twenty Ten (4 posts)

  1. rachelshoots
    Member
    Posted 3 years 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

  2. alchymyth
    Forum Moderator
    Posted 3 years 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

  3. rachelshoots
    Member
    Posted 3 years 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?

  4. Luke Gedeon
    Member
    Posted 3 years ago #

    Rachel,

    Since you are really just wanting a smaller image you do have another option. Upload a 940x198 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.

Topic Closed

This topic has been closed to new replies.

About this Topic