Header in Lifestyle theme

Community Forums Forums General Discussion Header in Lifestyle theme

This topic is: not resolved

This topic contains 6 replies, has 3 voices, and was last updated by  anitac 3 months ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #101651

    terribelford
    Member
    Post count: 2

    Hi, I have used Lifestyle Pro child theme on Genesis before and never had this issue but I am uploading a JPGgraphic that is exactly 320X110 and it shows up tiny in the header. I tried with a different 320X110 image and the same thing happened. I’m sure I’m missing something very simple but can’t figure out what it is. Anyone have a solution?

    http://www.dequeenofdeclutter.com
    #101666

    Lauren @ OnceCoupled
    Member
    Post count: 512

    Hey there,

    I’m not fully understanding what you want. Your logo is showing up at 320 x 110px, how exactly are you wanting it to appear?

    To decrease the height surrounding it, remove the padding from:

    .site-header {
         background-color: #76d2c5;
         padding: 48px;
         padding: 4.8rem;
         overflow: hidden;
    }

    I do custom WordPress work! http://oncecoupled.com
    Contact me directly: lauren@oncecoupled.com

    #101693

    terribelford
    Member
    Post count: 2

    Thank you, Lauren. What I’m trying to do is take this logo and make it much larger to fill the whole header. I realize 320×110 is too small but in the custom header section of the dashboard, it says “mages of exactly 320 × 110 pixels will be used as-is.” so I assumed it would load at the size it needs to be. I can’t seem to get it to scale to the full size of the existing header. I’m sure I’m missing something simple but can’t figure out what.

    #101748

    Lauren @ OnceCoupled
    Member
    Post count: 512

    In that case, you’d need to change the custom header dimensions in your functions file.
    Custom Header Support: http://gregrickaby.com/genesis-code-snippets/#header

    You’ll also need to update your CSS so the new image fits in your layout. Look for the header section of your style sheet and change the padding or dimensions of different areas there, as needed.

    Best,
    Lauren


    I do custom WordPress work! http://oncecoupled.com
    Contact me directly: lauren@oncecoupled.com

    #101784

    anitac
    Participant
    Post count: 6991

    Just to add a side note here – “as is” means as you have uploaded it. It will not take a 320 x 110 and stretch it out to fit the area. The Lifestyle Pro Theme has the support for custom header located in the functions.php file:

    //* Add support for custom header
    add_theme_support( 'custom-header', array(
    	'header_image'    => '',
    	'header-selector' => '.site-title a',
    	'header-text'     => false,
    	'height'          => 110,
    	'width'           => 320,
    ) );

    If you create a larger image – change the 110 and 320 to the size of your new header. Then upload the new header again.

    Then go to your style sheet and look for this:

    .header-image .site-title a {
    	float: left;
    	margin-bottom: 15px;
    	min-height: 110px;
    	width: 100%;
    }

    Change the 110px to the size of the new header image.


    Let me help you customize your theme, responsive header, Buddypress, Agentpress or technical issue!
    Visit me here: Cre8tiveDiva.com | Tweet Me! | Plus Me!
    When asking for help, please provide a link or screen shot showing your problem!

    #101992

    terribelford
    Member
    Post count: 2

    Thank you, AnitaC. What I am trying to figure out is what the actual size needs to be to fill the space of the default header in Lifestyle Pro. In other Genesis themes, I’ve been able to just upload an image and crop it to scale. how to I take an image that is the 110×320 and scale it to fit the existing header?

    #101994

    anitac
    Participant
    Post count: 6991

    The header width would be approximately 1068px wide without the 48px padding. Or, about 972px wide if you keep the 48px padding. You cannot scale an image that small to fit a space that large.


    Let me help you customize your theme, responsive header, Buddypress, Agentpress or technical issue!
    Visit me here: Cre8tiveDiva.com | Tweet Me! | Plus Me!
    When asking for help, please provide a link or screen shot showing your problem!

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.