header image

  • Resolved LMP3940wp

    (@lmp3940wp)


    6 years, 8 months ago

    I have created a header image for the specified pixels. But when I upload it, it appears as a postage stamp instead of spanning the page.
    What is my remedy?

    Here is what it looks like: http://thegoldalliance.org/how-us-money-migrated-from-honest-money-to-bogus-aka-fiat-money header is too small

Viewing 5 replies - 16 through 20 (of 20 total)
1 2
  • Thu P. a11n

    (@thup90)

    6 years, 8 months ago

    I think you also deleted the below when you deleted the .header-image .site-title > a, please add it back to the code:

    .header-image .title-area {
max-width: 100%;
}
    Thread Starter LMP3940wp

    (@lmp3940wp)

    6 years, 8 months ago

    This code was still there.
    I just now deleted one of the blank lines between the /* and */ and the image appeared ok. That is, it appears to work now.
    This is the code that I have:
    /*
    You can add your own CSS here.

    Click the help icon above to learn more.
    */

    .header-full-width .title-area {
    max-width: 100%;
    }

    .header-image .site-title > a {
    background-size: contain !important;
    min-height: 304px;
    }

    So it appears that we are good.
    This CSS stuff is a mystery to me.

    Thread Starter LMP3940wp

    (@lmp3940wp)

    6 years, 8 months ago

    Question:
    the image depth appears much deeper than the 160 px.
    it takes up about half of the vertical space on my screen.
    Any way to reduce that without truncating the image?

    Thread Starter LMP3940wp

    (@lmp3940wp)

    6 years, 8 months ago

    I just now dropped the 304 down to 160, so I see how that works.
    Is it true that I could add a much wider image, say 1200px instead of the now 600px and use more of the real estate? Really no need to have so much blank space on both sides of the image.
    here is what it looks like right now: http://thegoldalliance.org/wp-admin/customize.php?autofocus%5Bsection%5D=custom_css&return=http%3A%2F%2Fthegoldalliance.org%2Fwp-admin%2F

    Thread Starter LMP3940wp

    (@lmp3940wp)

    6 years, 8 months ago

    I just now, finally, got a response from the Genesis folks. Apparently the “Header Image” is supposed to be a small logo and not span the page. Why someone would want a small logo in the middle of the page makes no sense to me. Here, FYI, is what Genesis support wrote me. The instructions about the theme doesn’t have this.

    ——————————————————————————

    The header image is intended for displaying a small logo on the top of your site and not a full width image.

    And although the upload size of the image is 600×160 pixels, the display size is 300×80 pixels. The upload size is 2x as large as the display size so that the image will appear crisp on a retina screen.

    You can read more about it here: https://my.studiopress.com/documentation/genesis-sample-theme/customize-your-settings/header-image/

    If you’d like to use a full width image in the site header, you’ll need to make several edits to the theme’s style.css file.

    Unfortunately, we don’t have copy/paste code to provide you for this, as it is custom code that would need to be written and tested specifically for your site. Also, we generally do not give step by step instructions for theme customizations such as this: http://www.studiopress.com/what-support-includes.

    However, I did find this tutorial that was written by a member of the Genesis community that might help you get started: https://wpbeaches.com/add-full-width-responsive-header-image/

    You may want to post a thread in our Community Forums. It’s possible that another user has done something similar and would be willing to share their code with you: http://studiopress.com/forums

    You could also check out the other community resources such as the Slack channel and Facebook group: https://my.studiopress.com/community/

    If you wish to have someone assist you with the change, we have a list of recommended Genesis developers – just visit http://www.studiopress.com/genesis-developers for a list.

    Please let us know if you have further questions and we will be happy to assist you.

Viewing 5 replies - 16 through 20 (of 20 total)
1 2
  • The topic ‘header image’ is closed to new replies.