WordPress.org

Ready to get started?Download WordPress

Forums

Decode
[resolved] Custom Header Banner (11 posts)

  1. jenfr37
    Member
    Posted 3 months ago #

    I created a custom header image. The size is very small when I upload it (can be seen on http://www.jennifercotti.com)

    How do I change the size?
    Thanks!

  2. Scott Smith
    Member
    Theme Author

    Posted 3 months ago #

    It looks pretty large to me. Do you still want the image larger?

  3. jenfr37
    Member
    Posted 3 months ago #

    I'm sorry I took the smaller one down. I'll put it back up again. The one you saw wasn't the one I wanted to keep up.

  4. Scott Smith
    Member
    Theme Author

    Posted 3 months ago #

    Ah, so you've moved the header text up 38 pixels, but now the site image is being overlapped. What I would do, instead of raising the position of the header is add a margin to the bottom of it like this:

    .site-title { margin-bottom: 38px; }

    You can easily add this CSS to your blog in Appearance > Customize > Other Options and copy in that CSS into the "Custom CSS" field. Be sure to remove the top: -38px; CSS from wherever you put it.

  5. jenfr37
    Member
    Posted 3 months ago #

    Actually, I'm trying to make the site image the header in place of the font. I don't want the image to be raised. I want the image to be the header..if possible. Every time I attempt to make it the header though it turns out like a tiny image. I'll bet that was as clear as mud.

    I want the font to go away and the image to be bigger and be the header.

  6. jenfr37
    Member
    Posted 3 months ago #

    I actually made it clearer for you and went back to the site and took away the script font so you should see my thought process easier. :)

  7. jenfr37
    Member
    Posted 3 months ago #

    I'm trying to enlarge that image and not sure how to make that image larger. Sorry!!

  8. Devora
    Member
    Posted 3 months ago #

    .site-logo {
    margin: 0 auto 2%;
    max-height: 8.5em;
    opacity: 1;
    transition: opacity 0.5s ease-out 0s;
    width: auto;
    }

    change or remove the max-height in the code above-in style.css

  9. Scott Smith
    Member
    Theme Author

    Posted 3 months ago #

    Well, don't change anything in style.css, but use the Custom CSS field in the Other Options section of the Customize menu and add .site-logo { max-height: 8.5em; } and replace that number with whatever you think looks best.

  10. Devora
    Member
    Posted 3 months ago #

    yes, of course, always use the custom css!

  11. jenfr37
    Member
    Posted 3 months ago #

    It worked like a charm!! I am not good with code and .css, I know just enough to get done what I need done. :) You made it easy and effortless! And I LOVE my theme! Thank you!!

Reply

You must log in to post.

About this Theme

About this Topic