Lifestyle Pro Header Cropped After Customizations

Community Forums Forums Design Tips and Tricks Lifestyle Pro Header Cropped After Customizations

This topic is: not resolved

This topic contains 10 replies, has 4 voices, and was last updated by  maryriley 10 months ago.

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #71256

    Liz
    Participant
    Post count: 6

    I’ve been following the instructions I found from another post directing me to this site. But for some reason it’s cropping my header when I make my browser window smaller, any ideas what’s going on and why the header image will not resize?

    I’m pretty new to WP and CSS, so be gentle (i.e. speak to me like I’m 5, it’s okay. I know some things but don’t assume too much.)

    http://header, lifestyle pro, lifestyle, custom header
    #71343

    braddalton
    Participant
    Post count: 9759

    Its re-sizing your header on smaller screens?

    Please link to your site.


    Specializing In StudioPress Child Theme Customization.
    500+ StudioPress Tutorials

    #71663

    Liz
    Participant
    Post count: 6

    OH gosh – sorry!!
    http://www.maidennantucket.com

    #71801

    braddalton
    Participant
    Post count: 9759

    Looks like its cutoff even at full size.

    You will need to resize your header image and make sure it matches the same same as your settings before uploading it.

    Here’s a guide which will help you http://wpsites.net/web-design/customize-lifestyle-pro-theme-header-image-area/


    Specializing In StudioPress Child Theme Customization.
    500+ StudioPress Tutorials

    #72413

    dave andrew
    Participant
    Post count: 8

    To the best of my knowledge I have completed the tutorial. I loaded a smaller image than the numbers and it still asked me to crop it, luckily it was minor. So I saved the image that looked perfect and then I get cropping on the header logo. I’m a bit confused, it seems to be ignoring image sizes. I added the code to take out the pading but it still seems to have padding. Is this the problem. The test site is esbfactory.com

    #72430

    braddalton
    Participant
    Post count: 9759

    The image size needs to match the Custom Header size or you will be forced to crop it.

    You can change the values in the functions file or add your image using CSS code. http://wpsites.net/web-design/remove-padding-from-lifestyle-pro-site-header/


    Specializing In StudioPress Child Theme Customization.
    500+ StudioPress Tutorials

    #75199

    maryriley
    Member
    Post count: 7

    I followed the instructions you gave above, resized my custom header to 1140 x 200 and removed the padding. When I upload my image it does not ask me to crop but stretches it on the page. Is there a way to correct this?

    My blog is at: http://www.mothernaturesessentialoils.com

    Thank you in advance for your help!

    #75289

    braddalton
    Participant
    Post count: 9759

    You could reduce the size using CSS code.


    Specializing In StudioPress Child Theme Customization.
    500+ StudioPress Tutorials

    #75290

    maryriley
    Member
    Post count: 7

    That confuses me . . . I had sized the css code to 1140 x 200 and my image is 1140 x 200. Do I reduce my image or the css code? If the css code won’t it just cut out more of my image?

    I’ve seen other people with bigger header images then I’m using (height) and I can’t figure out how they are doing it.

    #75293

    braddalton
    Participant
    Post count: 9759

    You can use CSS rather than the Custom Header function to add the image.
    [css]
    .site-header {
    background: url(‘images/header.png’) no-repeat scroll 0 0 transparent;
    height: 200px;
    width: 1140px;
    padding: 0;
    }
    [/css]

    Untested


    Specializing In StudioPress Child Theme Customization.
    500+ StudioPress Tutorials

    #75303

    maryriley
    Member
    Post count: 7

    Thank you! I’ll try that :)

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

You must be logged in to reply to this topic.